@flozy/editor 3.8.1 → 3.8.2
Sign up to get free protection for your applications and to get access to all the features.
- package/dist/Editor/ChatEditor.js +55 -45
- package/dist/Editor/CommonEditor.js +111 -169
- package/dist/Editor/Elements/AI/AIInput.js +5 -16
- package/dist/Editor/Elements/AI/PopoverAIInput.js +17 -31
- package/dist/Editor/Elements/AI/Styles.js +1 -2
- package/dist/Editor/Elements/Accordion/Accordion.js +7 -74
- package/dist/Editor/Elements/Accordion/AccordionBtnPopup.js +2 -3
- package/dist/Editor/Elements/Accordion/AccordionSummary.js +60 -4
- package/dist/Editor/Elements/AppHeader/AppHeader.js +4 -26
- package/dist/Editor/Elements/Button/EditorButton.js +16 -28
- package/dist/Editor/Elements/Color Picker/ColorButtons.js +17 -60
- package/dist/Editor/Elements/Color Picker/ColorPicker.css +1 -25
- package/dist/Editor/Elements/Color Picker/ColorPicker.js +4 -4
- package/dist/Editor/Elements/Color Picker/Styles.js +1 -2
- package/dist/Editor/Elements/Embed/Image.js +20 -28
- package/dist/Editor/Elements/Embed/Video.js +11 -15
- package/dist/Editor/Elements/Emoji/EmojiPicker.js +4 -2
- package/dist/Editor/Elements/Form/Workflow/UserInputs.js +1 -2
- package/dist/Editor/Elements/Grid/Grid.js +0 -2
- package/dist/Editor/Elements/Grid/GridItem.js +1 -3
- package/dist/Editor/Elements/Link/Link.js +1 -6
- package/dist/Editor/Elements/Link/LinkButton.js +2 -4
- package/dist/Editor/Elements/Link/LinkPopup.js +3 -11
- package/dist/Editor/Elements/Table/Table.js +1 -1
- package/dist/Editor/Elements/Table/TableCell.js +1 -1
- package/dist/Editor/MiniEditor.js +1 -3
- package/dist/Editor/Toolbar/Basic/index.js +2 -4
- package/dist/Editor/Toolbar/FormatTools/Dropdown.js +2 -26
- package/dist/Editor/Toolbar/FormatTools/MarkButton.js +2 -2
- package/dist/Editor/Toolbar/FormatTools/TextSize.js +11 -5
- package/dist/Editor/Toolbar/PopupTool/MiniTextFormat/SelectFontSize.js +11 -4
- package/dist/Editor/Toolbar/PopupTool/MiniTextFormat/SelectTypography.js +86 -213
- package/dist/Editor/Toolbar/PopupTool/MiniTextFormat/index.js +1 -2
- package/dist/Editor/Toolbar/PopupTool/PopupToolStyle.js +13 -20
- package/dist/Editor/Toolbar/PopupTool/TextFormat.js +7 -52
- package/dist/Editor/Toolbar/PopupTool/index.js +5 -6
- package/dist/Editor/Toolbar/toolbarGroups.js +6 -48
- package/dist/Editor/assets/svg/AIIcons.js +1 -153
- package/dist/Editor/common/ColorPickerButton.js +9 -25
- package/dist/Editor/common/DnD/DragHandleButton.js +1 -1
- package/dist/Editor/common/Icon.js +2 -30
- package/dist/Editor/common/LinkSettings/NavComponents.js +2 -5
- package/dist/Editor/common/LinkSettings/index.js +1 -2
- package/dist/Editor/common/LinkSettings/navOptions.js +2 -7
- package/dist/Editor/common/MentionsPopup/MentionsListCard.js +6 -1
- package/dist/Editor/common/MentionsPopup/Styles.js +2 -5
- package/dist/Editor/common/Shorthands/elements.js +0 -54
- package/dist/Editor/common/StyleBuilder/accordionTitleBtnStyle.js +7 -7
- package/dist/Editor/common/StyleBuilder/accordionTitleStyle.js +16 -16
- package/dist/Editor/common/StyleBuilder/buttonStyle.js +2 -4
- package/dist/Editor/common/StyleBuilder/fieldTypes/bannerSpacing.js +3 -13
- package/dist/Editor/common/StyleBuilder/fieldTypes/borderRadius.js +7 -15
- package/dist/Editor/common/StyleBuilder/fieldTypes/buttonLink.js +1 -1
- package/dist/Editor/common/StyleBuilder/fieldTypes/color.js +7 -31
- package/dist/Editor/common/StyleBuilder/fieldTypes/fontSize.js +4 -13
- package/dist/Editor/common/StyleBuilder/fieldTypes/textOptions.js +4 -14
- package/dist/Editor/common/StyleBuilder/index.js +1 -1
- package/dist/Editor/helper/theme.js +4 -190
- package/dist/Editor/hooks/useMouseMove.js +2 -4
- package/dist/Editor/plugins/withEmbeds.js +1 -1
- package/dist/Editor/plugins/withHTML.js +5 -47
- package/dist/Editor/plugins/withLayout.js +10 -15
- package/dist/Editor/plugins/withTable.js +2 -2
- package/dist/Editor/theme/ThemeList.js +173 -50
- package/dist/Editor/utils/SlateUtilityFunctions.js +25 -161
- package/dist/Editor/utils/button.js +17 -1
- package/dist/Editor/utils/draftToSlate.js +1 -1
- package/dist/Editor/utils/events.js +4 -11
- package/dist/Editor/utils/font.js +37 -40
- package/dist/Editor/utils/helper.js +1 -51
- package/package.json +1 -2
- package/dist/Editor/Elements/AI/VoiceToText/AudioWave.js +0 -73
- package/dist/Editor/Elements/AI/VoiceToText/index.js +0 -167
- package/dist/Editor/Elements/AI/VoiceToText/style.js +0 -40
- package/dist/Editor/Elements/Link/LinkPopupStyles.js +0 -28
- package/dist/Editor/Toolbar/PopupTool/ThemeTextFormat.js +0 -438
- package/dist/Editor/assets/svg/ThemeIcons.js +0 -291
- package/dist/Editor/common/CustomColorPicker/index.js +0 -106
- package/dist/Editor/common/CustomColorPicker/style.js +0 -53
- package/dist/Editor/common/CustomDialog/index.js +0 -94
- package/dist/Editor/common/CustomDialog/style.js +0 -67
- package/dist/Editor/common/CustomSelect.js +0 -33
- package/dist/Editor/common/EditorCmds.js +0 -35
- package/dist/Editor/hooks/useEditorTheme.js +0 -139
- package/dist/Editor/theme/index.js +0 -144
- package/dist/Editor/themeSettings/ActiveTheme.js +0 -72
- package/dist/Editor/themeSettings/buttons/index.js +0 -290
- package/dist/Editor/themeSettings/buttons/style.js +0 -21
- package/dist/Editor/themeSettings/colorTheme/index.js +0 -290
- package/dist/Editor/themeSettings/colorTheme/style.js +0 -77
- package/dist/Editor/themeSettings/fonts/PreviewElement.js +0 -123
- package/dist/Editor/themeSettings/fonts/index.js +0 -213
- package/dist/Editor/themeSettings/fonts/style.js +0 -44
- package/dist/Editor/themeSettings/icons.js +0 -60
- package/dist/Editor/themeSettings/index.js +0 -320
- package/dist/Editor/themeSettings/style.js +0 -152
- package/dist/Editor/themeSettingsAI/icons.js +0 -96
- package/dist/Editor/themeSettingsAI/index.js +0 -356
- package/dist/Editor/themeSettingsAI/saveTheme.js +0 -190
- package/dist/Editor/themeSettingsAI/style.js +0 -247
@@ -95,20 +95,16 @@ const Video = ({
|
|
95
95
|
setOpenSettings(true);
|
96
96
|
};
|
97
97
|
const onSave = data => {
|
98
|
-
|
99
|
-
|
100
|
-
|
101
|
-
|
102
|
-
|
103
|
-
|
104
|
-
|
105
|
-
|
106
|
-
|
107
|
-
|
108
|
-
onClose();
|
109
|
-
} catch (err) {
|
110
|
-
console.log(err);
|
111
|
-
}
|
98
|
+
const updateData = {
|
99
|
+
...data
|
100
|
+
};
|
101
|
+
delete updateData.children;
|
102
|
+
Transforms.setNodes(editor, {
|
103
|
+
...updateData
|
104
|
+
}, {
|
105
|
+
at: path
|
106
|
+
});
|
107
|
+
onClose();
|
112
108
|
};
|
113
109
|
const onClose = () => {
|
114
110
|
setOpenSettings(false);
|
@@ -182,7 +178,7 @@ const Video = ({
|
|
182
178
|
};
|
183
179
|
return /*#__PURE__*/_jsxs(Box, {
|
184
180
|
...attributes,
|
185
|
-
className: "embed has-hover video
|
181
|
+
className: "embed has-hover video",
|
186
182
|
sx: {
|
187
183
|
display: {
|
188
184
|
lg: "flex",
|
@@ -4,12 +4,14 @@ import { jsx as _jsx } from "react/jsx-runtime";
|
|
4
4
|
import { Fragment as _Fragment } from "react/jsx-runtime";
|
5
5
|
const EmojiPicker = props => {
|
6
6
|
const {
|
7
|
-
onEmojiSelect
|
7
|
+
onEmojiSelect,
|
8
|
+
onClose
|
8
9
|
} = props;
|
9
10
|
return /*#__PURE__*/_jsx(_Fragment, {
|
10
11
|
children: /*#__PURE__*/_jsx(Picker, {
|
11
12
|
data: data,
|
12
|
-
onEmojiSelect: onEmojiSelect
|
13
|
+
onEmojiSelect: onEmojiSelect,
|
14
|
+
onClickOutside: onClose
|
13
15
|
})
|
14
16
|
});
|
15
17
|
};
|
@@ -15,7 +15,6 @@ import { gridItem } from "../../utils/gridItem";
|
|
15
15
|
import { useEditorContext, useEditorSelection } from "../../hooks/useMouseMove";
|
16
16
|
import { getTRBLBreakPoints, getBreakPointsValue } from "../../helper/theme";
|
17
17
|
import useWindowResize from "../../hooks/useWindowResize";
|
18
|
-
import { useTheme } from "@emotion/react";
|
19
18
|
import { jsx as _jsx } from "react/jsx-runtime";
|
20
19
|
import { Fragment as _Fragment } from "react/jsx-runtime";
|
21
20
|
import { jsxs as _jsxs } from "react/jsx-runtime";
|
@@ -76,7 +75,6 @@ const GridToolBar = ({
|
|
76
75
|
}) : null;
|
77
76
|
};
|
78
77
|
const Grid = props => {
|
79
|
-
const theme = useTheme();
|
80
78
|
const {
|
81
79
|
attributes,
|
82
80
|
children,
|
@@ -8,7 +8,6 @@ import { GridSettingsIcon } from "../../common/iconslist";
|
|
8
8
|
import { useEditorContext, useEditorSelection } from "../../hooks/useMouseMove";
|
9
9
|
import { getBreakPointsValue, getTRBLBreakPoints } from "../../helper/theme";
|
10
10
|
import { isEmptyNode } from "../../utils/helper";
|
11
|
-
import { useTheme } from "@emotion/react";
|
12
11
|
import { jsx as _jsx } from "react/jsx-runtime";
|
13
12
|
import { jsxs as _jsxs } from "react/jsx-runtime";
|
14
13
|
const GridItemToolbar = ({
|
@@ -35,7 +34,6 @@ const GridItemToolbar = ({
|
|
35
34
|
}) : null;
|
36
35
|
};
|
37
36
|
const GridItem = props => {
|
38
|
-
const theme = useTheme();
|
39
37
|
const {
|
40
38
|
attributes,
|
41
39
|
children,
|
@@ -121,7 +119,7 @@ const GridItem = props => {
|
|
121
119
|
xs: xsHidden ? "none" : "flex"
|
122
120
|
},
|
123
121
|
flexDirection: flexDirection || "column",
|
124
|
-
background: bgColor,
|
122
|
+
background: bgColor || "transparent",
|
125
123
|
borderColor: getBorderColor(),
|
126
124
|
borderWidth: borderWidth || "1px",
|
127
125
|
borderRadius: {
|
@@ -9,7 +9,6 @@ import { removeLink } from "../../utils/link";
|
|
9
9
|
import LinkPopup from "./LinkPopup";
|
10
10
|
import "./styles.css";
|
11
11
|
import { absoluteLink } from "../../utils/helper";
|
12
|
-
import { useEditorContext } from "../../hooks/useMouseMove";
|
13
12
|
import { jsx as _jsx } from "react/jsx-runtime";
|
14
13
|
import { jsxs as _jsxs } from "react/jsx-runtime";
|
15
14
|
const Link = props => {
|
@@ -30,9 +29,6 @@ const Link = props => {
|
|
30
29
|
const path = ReactEditor.findPath(editor, element);
|
31
30
|
const urlPath = element.url || element.href;
|
32
31
|
const absLink = absoluteLink(urlPath);
|
33
|
-
const {
|
34
|
-
theme
|
35
|
-
} = useEditorContext();
|
36
32
|
const updateLink = () => {
|
37
33
|
Transforms.setNodes(editor, {
|
38
34
|
href: linkData?.url,
|
@@ -111,8 +107,7 @@ const Link = props => {
|
|
111
107
|
linkData: linkData,
|
112
108
|
handleClose: handleClose,
|
113
109
|
handleInputChange: handleInputChange,
|
114
|
-
handleInsertLink: updateLink
|
115
|
-
theme: theme
|
110
|
+
handleInsertLink: updateLink
|
116
111
|
})]
|
117
112
|
});
|
118
113
|
};
|
@@ -9,8 +9,7 @@ import { jsx as _jsx } from "react/jsx-runtime";
|
|
9
9
|
import { jsxs as _jsxs } from "react/jsx-runtime";
|
10
10
|
const LinkButton = props => {
|
11
11
|
const {
|
12
|
-
editor
|
13
|
-
theme
|
12
|
+
editor
|
14
13
|
} = props;
|
15
14
|
const linkInputRef = useRef(null);
|
16
15
|
const [showInput, setShowInput] = useState(false);
|
@@ -78,8 +77,7 @@ const LinkButton = props => {
|
|
78
77
|
linkData: linkData,
|
79
78
|
handleClose: handleClose,
|
80
79
|
handleInputChange: handleInputChange,
|
81
|
-
handleInsertLink: handleInsertLink
|
82
|
-
theme: theme
|
80
|
+
handleInsertLink: handleInsertLink
|
83
81
|
})]
|
84
82
|
});
|
85
83
|
};
|
@@ -1,7 +1,6 @@
|
|
1
1
|
import React from "react";
|
2
2
|
import { Dialog, DialogActions, DialogContent, DialogTitle, FormControl, FormControlLabel, Grid, TextField, Button, IconButton, Typography, Checkbox } from "@mui/material";
|
3
3
|
import CloseIcon from "@mui/icons-material/Close";
|
4
|
-
import LinkPopupStyles from "./LinkPopupStyles";
|
5
4
|
import { jsx as _jsx } from "react/jsx-runtime";
|
6
5
|
import { jsxs as _jsxs } from "react/jsx-runtime";
|
7
6
|
const LinkPopup = props => {
|
@@ -10,10 +9,8 @@ const LinkPopup = props => {
|
|
10
9
|
handleClose,
|
11
10
|
linkData,
|
12
11
|
handleInputChange,
|
13
|
-
handleInsertLink
|
14
|
-
theme
|
12
|
+
handleInsertLink
|
15
13
|
} = props;
|
16
|
-
const classes = LinkPopupStyles(theme);
|
17
14
|
return /*#__PURE__*/_jsxs(Dialog, {
|
18
15
|
fullWidth: true,
|
19
16
|
open: open,
|
@@ -47,16 +44,13 @@ const LinkPopup = props => {
|
|
47
44
|
style: {
|
48
45
|
paddingTop: "12px"
|
49
46
|
},
|
50
|
-
className: classes.titleTypo,
|
51
47
|
children: /*#__PURE__*/_jsx(TextField, {
|
52
48
|
size: "small",
|
53
49
|
fullWidth: true,
|
54
50
|
value: linkData?.name,
|
55
51
|
name: "name",
|
56
52
|
placeholder: "Link Title",
|
57
|
-
onChange: handleInputChange
|
58
|
-
sx: classes.addLinkField,
|
59
|
-
className: classes.addLinkField
|
53
|
+
onChange: handleInputChange
|
60
54
|
})
|
61
55
|
}), /*#__PURE__*/_jsx(Grid, {
|
62
56
|
item: true,
|
@@ -70,9 +64,7 @@ const LinkPopup = props => {
|
|
70
64
|
name: "url",
|
71
65
|
value: linkData?.url,
|
72
66
|
placeholder: "https://google.com",
|
73
|
-
onChange: handleInputChange
|
74
|
-
sx: classes.addLinkField,
|
75
|
-
className: classes.addLinkField
|
67
|
+
onChange: handleInputChange
|
76
68
|
})
|
77
69
|
}), /*#__PURE__*/_jsx(Grid, {
|
78
70
|
item: true,
|
@@ -117,7 +117,7 @@ const TableCell = props => {
|
|
117
117
|
className: `editor-table-cell ${hasSelected ? "selection" : ""}`,
|
118
118
|
style: {
|
119
119
|
position: "relative",
|
120
|
-
|
120
|
+
backgroundColor: bgColor || entireBgColor,
|
121
121
|
border: `3px solid ${cellBorderColor}`,
|
122
122
|
...(sizeProps || {})
|
123
123
|
},
|
@@ -23,8 +23,7 @@ const MiniEditor = props => {
|
|
23
23
|
miniEditorPlaceholder,
|
24
24
|
className,
|
25
25
|
otherProps,
|
26
|
-
onSave
|
27
|
-
theme
|
26
|
+
onSave
|
28
27
|
} = props;
|
29
28
|
const {
|
30
29
|
CHARACTERS = []
|
@@ -133,7 +132,6 @@ const MiniEditor = props => {
|
|
133
132
|
editor: editor,
|
134
133
|
initialValue: content,
|
135
134
|
onChange: onChange,
|
136
|
-
theme: theme,
|
137
135
|
children: [/*#__PURE__*/_jsx(BasicToolbar, {
|
138
136
|
...props
|
139
137
|
}), /*#__PURE__*/_jsx(Editable, {
|
@@ -25,8 +25,7 @@ const BasicToolbar = props => {
|
|
25
25
|
hideTextColor = false,
|
26
26
|
hideResetIcon = true,
|
27
27
|
onResetClick = () => {}
|
28
|
-
}
|
29
|
-
theme
|
28
|
+
}
|
30
29
|
} = props;
|
31
30
|
// state
|
32
31
|
const [activeColor, setActiveColor] = useState("#000000");
|
@@ -66,8 +65,7 @@ const BasicToolbar = props => {
|
|
66
65
|
item: true,
|
67
66
|
children: /*#__PURE__*/_jsx(LinkButton, {
|
68
67
|
active: isBlockActive(editor, link.format),
|
69
|
-
editor: editor
|
70
|
-
theme: theme
|
68
|
+
editor: editor
|
71
69
|
}, link.id)
|
72
70
|
}), !hideTextColor && /*#__PURE__*/_jsx(Grid, {
|
73
71
|
item: true,
|
@@ -1,32 +1,8 @@
|
|
1
1
|
import React from "react";
|
2
2
|
import { Select, MenuItem } from "@mui/material";
|
3
|
-
import { addMarkData, activeMark
|
3
|
+
import { addMarkData, activeMark } from "../../utils/SlateUtilityFunctions.js";
|
4
4
|
import { fontFamilyMap } from "../../utils/font";
|
5
|
-
import { toolbarGroups } from "../toolbarGroups.js";
|
6
5
|
import { jsx as _jsx } from "react/jsx-runtime";
|
7
|
-
const allTools = toolbarGroups.flat();
|
8
|
-
const fontWeight = allTools.find(f => f.format === "fontWeight");
|
9
|
-
const getValue = (editor, format) => {
|
10
|
-
switch (format) {
|
11
|
-
case "fontFamily":
|
12
|
-
{
|
13
|
-
const style = getSelectedElementStyle("font-family", editor);
|
14
|
-
const val = Object.entries(fontFamilyMap).find(([key, value]) => value === style)?.[0];
|
15
|
-
return val || fontFamilyMap.PoppinsRegular;
|
16
|
-
}
|
17
|
-
case "fontWeight":
|
18
|
-
{
|
19
|
-
const {
|
20
|
-
options
|
21
|
-
} = fontWeight || {};
|
22
|
-
const fontWeightStyle = getSelectedElementStyle("font-weight", editor);
|
23
|
-
const selected = options?.find(o => o.value === fontWeightStyle || o.numVal === fontWeightStyle);
|
24
|
-
return selected?.value;
|
25
|
-
}
|
26
|
-
default:
|
27
|
-
return activeMark(editor, format);
|
28
|
-
}
|
29
|
-
};
|
30
6
|
const Dropdown = ({
|
31
7
|
classes,
|
32
8
|
editor,
|
@@ -34,7 +10,7 @@ const Dropdown = ({
|
|
34
10
|
options,
|
35
11
|
width
|
36
12
|
}) => {
|
37
|
-
const value =
|
13
|
+
const value = activeMark(editor, format);
|
38
14
|
const changeMarkData = (event, format) => {
|
39
15
|
event.preventDefault();
|
40
16
|
const value = event.target.value;
|
@@ -1,7 +1,7 @@
|
|
1
1
|
import React from "react";
|
2
2
|
import Icon from "../../common/Icon";
|
3
3
|
import Button from "../../common/Button";
|
4
|
-
import { toggleMark,
|
4
|
+
import { toggleMark, isMarkActive } from "../../utils/SlateUtilityFunctions.js";
|
5
5
|
import { jsx as _jsx } from "react/jsx-runtime";
|
6
6
|
const MarkButton = ({
|
7
7
|
editor,
|
@@ -9,7 +9,7 @@ const MarkButton = ({
|
|
9
9
|
title
|
10
10
|
}) => {
|
11
11
|
return /*#__PURE__*/_jsx(Button, {
|
12
|
-
active:
|
12
|
+
active: isMarkActive(editor, format),
|
13
13
|
format: format,
|
14
14
|
onMouseDown: e => {
|
15
15
|
e.preventDefault();
|
@@ -1,8 +1,9 @@
|
|
1
1
|
import React from "react";
|
2
2
|
import { TextField, IconButton } from "@mui/material";
|
3
|
-
import { addMarkData, activeMark } from "../../utils/SlateUtilityFunctions.js";
|
3
|
+
import { addMarkData, activeMark, isBlockActive } from "../../utils/SlateUtilityFunctions.js";
|
4
|
+
import { headingMap, sizeMap } from "../../utils/font.js";
|
4
5
|
import { TextMinusIcon, TextPlusIcon } from "../../common/iconslist.js";
|
5
|
-
import { getBreakPointsValue
|
6
|
+
import { getBreakPointsValue } from "../../helper/theme.js";
|
6
7
|
import useWindowResize from "../../hooks/useWindowResize.js";
|
7
8
|
import { BREAKPOINTS_DEVICES } from "../../helper/theme.js";
|
8
9
|
import { jsx as _jsx } from "react/jsx-runtime";
|
@@ -16,8 +17,7 @@ const TextSize = ({
|
|
16
17
|
}) => {
|
17
18
|
const [size] = useWindowResize();
|
18
19
|
const val = activeMark(editor, format);
|
19
|
-
const
|
20
|
-
const value = noFontSize ? getTextSizeVal(editor) : getBreakPointsValue(val, size?.device);
|
20
|
+
const value = getBreakPointsValue(val, size?.device);
|
21
21
|
const updateMarkData = newVal => {
|
22
22
|
let upData = {
|
23
23
|
...getBreakPointsValue(val),
|
@@ -46,7 +46,13 @@ const TextSize = ({
|
|
46
46
|
};
|
47
47
|
const getSizeVal = () => {
|
48
48
|
try {
|
49
|
-
|
49
|
+
let size = `${value}`?.indexOf("px") >= 0 ? value : sizeMap[value] || value;
|
50
|
+
Object.entries(headingMap).forEach(([format, value]) => {
|
51
|
+
if (isBlockActive(editor, format) && isNaN(parseInt(size))) {
|
52
|
+
size = value;
|
53
|
+
}
|
54
|
+
});
|
55
|
+
return parseInt(size);
|
50
56
|
} catch (err) {
|
51
57
|
return "";
|
52
58
|
}
|
@@ -1,9 +1,10 @@
|
|
1
1
|
import { useEffect, useRef, useState } from "react";
|
2
|
-
import { activeMark, addMarkData } from "../../../utils/SlateUtilityFunctions";
|
2
|
+
import { activeMark, addMarkData, isBlockActive } from "../../../utils/SlateUtilityFunctions";
|
3
3
|
import { Button, IconButton, Popover, TextField } from "@mui/material";
|
4
4
|
import DownArrowIcon from "../../../assets/svg/DownArrowIcon";
|
5
5
|
import useWindowResize from "../../../hooks/useWindowResize";
|
6
|
-
import { BREAKPOINTS_DEVICES, getBreakPointsValue
|
6
|
+
import { BREAKPOINTS_DEVICES, getBreakPointsValue } from "../../../helper/theme";
|
7
|
+
import { headingMap, sizeMap } from "../../../utils/font";
|
7
8
|
import { jsx as _jsx } from "react/jsx-runtime";
|
8
9
|
import { jsxs as _jsxs } from "react/jsx-runtime";
|
9
10
|
const fontSizeOptions = [8, 9, 10, 11, 12, 14, 16, 18, 20, 22, 26, 32, 36, 40, 48, 64, 96, 128];
|
@@ -18,7 +19,7 @@ function SelectFontSize({
|
|
18
19
|
const containerRef = useRef();
|
19
20
|
const [size] = useWindowResize();
|
20
21
|
const val = activeMark(editor, format);
|
21
|
-
const value =
|
22
|
+
const value = getBreakPointsValue(val, size?.device);
|
22
23
|
const timerRef = useRef();
|
23
24
|
const updateMarkData = newVal => {
|
24
25
|
let upData = {
|
@@ -52,7 +53,13 @@ function SelectFontSize({
|
|
52
53
|
};
|
53
54
|
const getSizeVal = () => {
|
54
55
|
try {
|
55
|
-
|
56
|
+
let size = `${value}`?.indexOf("px") >= 0 ? value : sizeMap[value] || value;
|
57
|
+
Object.entries(headingMap).forEach(([format, value]) => {
|
58
|
+
if (isBlockActive(editor, format) && isNaN(parseInt(size))) {
|
59
|
+
size = value;
|
60
|
+
}
|
61
|
+
});
|
62
|
+
return parseInt(size);
|
56
63
|
} catch (err) {
|
57
64
|
return "";
|
58
65
|
}
|