@flozy/editor 4.0.1 → 4.0.2
Sign up to get free protection for your applications and to get access to all the features.
- package/dist/Editor/ChatEditor.js +3 -19
- package/dist/Editor/CommonEditor.js +181 -109
- package/dist/Editor/Editor.css +31 -3
- package/dist/Editor/Elements/AI/AIInput.js +31 -33
- package/dist/Editor/Elements/AI/CustomSelect.js +19 -12
- package/dist/Editor/Elements/AI/PopoverAIInput.js +73 -97
- package/dist/Editor/Elements/AI/Styles.js +2 -2
- package/dist/Editor/Elements/AI/VoiceToText/AudioWave.js +73 -0
- package/dist/Editor/Elements/AI/VoiceToText/index.js +184 -0
- package/dist/Editor/Elements/AI/VoiceToText/style.js +40 -0
- package/dist/Editor/Elements/AI/helper.js +5 -3
- package/dist/Editor/Elements/Accordion/Accordion.js +1 -1
- package/dist/Editor/Elements/Accordion/AccordionSummary.js +5 -10
- package/dist/Editor/Elements/AppHeader/AppHeader.js +26 -4
- package/dist/Editor/Elements/Button/EditorButton.js +28 -16
- package/dist/Editor/Elements/Carousel/CarouselButton.js +2 -1
- package/dist/Editor/Elements/Color Picker/ColorButtons.js +60 -15
- package/dist/Editor/Elements/Color Picker/ColorPicker.css +25 -1
- package/dist/Editor/Elements/Color Picker/ColorPicker.js +4 -4
- package/dist/Editor/Elements/Color Picker/Styles.js +3 -1
- package/dist/Editor/Elements/Emoji/EmojiPicker.js +2 -4
- package/dist/Editor/Elements/Form/Workflow/FormWorkflow.js +12 -3
- package/dist/Editor/Elements/Form/Workflow/UserInputs.js +2 -1
- package/dist/Editor/Elements/Grid/Grid.js +27 -3
- package/dist/Editor/Elements/Grid/GridItem.js +3 -1
- package/dist/Editor/Elements/Link/Link.js +6 -1
- package/dist/Editor/Elements/Link/LinkButton.js +4 -2
- package/dist/Editor/Elements/Link/LinkPopup.js +73 -14
- package/dist/Editor/Elements/Link/LinkPopupStyles.js +28 -0
- package/dist/Editor/Elements/List/CheckList.js +1 -2
- package/dist/Editor/Elements/NewLine/NewLineButton.js +2 -1
- package/dist/Editor/Elements/PageSettings/PageSettingsButton.js +3 -3
- package/dist/Editor/Elements/Redo/RedoButton.js +14 -0
- package/dist/Editor/Elements/Signature/Signature.css +13 -6
- package/dist/Editor/Elements/Signature/SignatureOptions/UploadSignature.js +2 -1
- package/dist/Editor/Elements/Signature/SignaturePopup.js +185 -30
- package/dist/Editor/Elements/SimpleText/index.js +11 -1
- package/dist/Editor/Elements/SimpleText/style.js +1 -1
- package/dist/Editor/Elements/Table/Styles.js +23 -1
- package/dist/Editor/Elements/Table/Table.js +2 -1
- package/dist/Editor/Elements/Table/TableCell.js +69 -7
- package/dist/Editor/Elements/TableContextMenu/TableContextMenu.js +1 -0
- package/dist/Editor/Elements/Undo/UndoButton.js +14 -0
- package/dist/Editor/MiniEditor.js +3 -1
- package/dist/Editor/Styles/EditorStyles.js +1 -1
- package/dist/Editor/Toolbar/Basic/index.js +4 -2
- package/dist/Editor/Toolbar/FormatTools/Dropdown.js +27 -3
- package/dist/Editor/Toolbar/FormatTools/MarkButton.js +2 -2
- package/dist/Editor/Toolbar/FormatTools/TextSize.js +31 -20
- package/dist/Editor/Toolbar/Mini/MiniToolbar.js +36 -5
- package/dist/Editor/Toolbar/Mini/Options/Options.js +10 -0
- package/dist/Editor/Toolbar/Mini/Styles.js +7 -0
- package/dist/Editor/Toolbar/PopupTool/ButtonTemplatesCard.js +12 -13
- package/dist/Editor/Toolbar/PopupTool/FullViewCard.js +12 -13
- package/dist/Editor/Toolbar/PopupTool/MiniTextFormat/CustomSelectTool.js +3 -0
- package/dist/Editor/Toolbar/PopupTool/MiniTextFormat/SelectFontSize.js +4 -11
- package/dist/Editor/Toolbar/PopupTool/MiniTextFormat/SelectSuperSubscript.js +59 -0
- package/dist/Editor/Toolbar/PopupTool/MiniTextFormat/SelectTypography.js +213 -86
- package/dist/Editor/Toolbar/PopupTool/MiniTextFormat/index.js +4 -2
- package/dist/Editor/Toolbar/PopupTool/PopupToolStyle.js +123 -44
- package/dist/Editor/Toolbar/PopupTool/TextFormat.js +106 -44
- package/dist/Editor/Toolbar/PopupTool/ThemeTextFormat.js +438 -0
- package/dist/Editor/Toolbar/PopupTool/index.js +7 -6
- package/dist/Editor/Toolbar/toolbarGroups.js +53 -11
- package/dist/Editor/assets/svg/AIIcons.js +153 -1
- package/dist/Editor/assets/svg/AddTemplateIcon.js +13 -10
- package/dist/Editor/assets/svg/RedoIcon.js +27 -0
- package/dist/Editor/assets/svg/SettingsIcon.js +28 -0
- package/dist/Editor/assets/svg/TextIcon.js +8 -5
- package/dist/Editor/assets/svg/ThemeIcons.js +291 -0
- package/dist/Editor/assets/svg/UndoIcon.js +27 -0
- package/dist/Editor/common/ColorPickerButton.js +26 -18
- package/dist/Editor/common/CustomColorPicker/index.js +106 -0
- package/dist/Editor/common/CustomColorPicker/style.js +53 -0
- package/dist/Editor/common/CustomDialog/index.js +94 -0
- package/dist/Editor/common/CustomDialog/style.js +67 -0
- package/dist/Editor/common/CustomSelect.js +33 -0
- package/dist/Editor/common/DnD/DragHandleButton.js +56 -47
- package/dist/Editor/common/EditorIcons.js +7 -7
- package/dist/Editor/common/Icon.js +64 -25
- package/dist/Editor/common/ImageList.js +16 -3
- package/dist/Editor/common/ImageSelector/ImageSelector.js +30 -9
- package/dist/Editor/common/ImageSelector/Styles.js +2 -1
- package/dist/Editor/common/LinkSettings/NavComponents.js +5 -2
- package/dist/Editor/common/LinkSettings/index.js +4 -2
- package/dist/Editor/common/LinkSettings/navOptions.js +7 -2
- package/dist/Editor/common/LinkSettings/style.js +11 -8
- package/dist/Editor/common/MentionsPopup/Styles.js +1 -1
- package/dist/Editor/common/Section/index.js +57 -7
- package/dist/Editor/common/Section/styles.js +11 -0
- package/dist/Editor/common/Shorthands/elements.js +63 -9
- package/dist/Editor/common/StyleBuilder/accordionTitleBtnStyle.js +1 -2
- package/dist/Editor/common/StyleBuilder/buttonStyle.js +4 -2
- package/dist/Editor/common/StyleBuilder/fieldTypes/bannerSpacing.js +13 -3
- package/dist/Editor/common/StyleBuilder/fieldTypes/borderRadius.js +15 -7
- package/dist/Editor/common/StyleBuilder/fieldTypes/buttonLink.js +1 -1
- package/dist/Editor/common/StyleBuilder/fieldTypes/color.js +29 -7
- package/dist/Editor/common/StyleBuilder/fieldTypes/fontSize.js +13 -4
- package/dist/Editor/common/StyleBuilder/fieldTypes/textOptions.js +14 -4
- package/dist/Editor/common/StyleBuilder/index.js +1 -1
- package/dist/Editor/common/iconListV2.js +843 -0
- package/dist/Editor/common/iconslist.js +0 -31
- package/dist/Editor/commonStyle.js +6 -0
- package/dist/Editor/helper/index.js +0 -22
- package/dist/Editor/helper/theme.js +189 -3
- package/dist/Editor/hooks/useEditorTheme.js +139 -0
- package/dist/Editor/hooks/useMouseMove.js +4 -1
- package/dist/Editor/hooks/useWindowMessage.js +10 -7
- package/dist/Editor/plugins/withEmbeds.js +1 -1
- package/dist/Editor/plugins/withHTML.js +1 -1
- package/dist/Editor/plugins/withTable.js +1 -1
- package/dist/Editor/theme/ThemeList.js +50 -173
- package/dist/Editor/theme/index.js +144 -0
- package/dist/Editor/themeSettings/ActiveTheme.js +72 -0
- package/dist/Editor/themeSettings/buttons/index.js +290 -0
- package/dist/Editor/themeSettings/buttons/style.js +21 -0
- package/dist/Editor/themeSettings/colorTheme/index.js +290 -0
- package/dist/Editor/themeSettings/colorTheme/style.js +77 -0
- package/dist/Editor/themeSettings/fonts/PreviewElement.js +123 -0
- package/dist/Editor/themeSettings/fonts/index.js +213 -0
- package/dist/Editor/themeSettings/fonts/style.js +44 -0
- package/dist/Editor/themeSettings/icons.js +60 -0
- package/dist/Editor/themeSettings/index.js +320 -0
- package/dist/Editor/themeSettings/style.js +152 -0
- package/dist/Editor/themeSettingsAI/icons.js +96 -0
- package/dist/Editor/themeSettingsAI/index.js +356 -0
- package/dist/Editor/themeSettingsAI/saveTheme.js +190 -0
- package/dist/Editor/themeSettingsAI/style.js +247 -0
- package/dist/Editor/utils/SlateUtilityFunctions.js +169 -27
- package/dist/Editor/utils/button.js +1 -17
- package/dist/Editor/utils/events.js +54 -2
- package/dist/Editor/utils/font.js +40 -37
- package/dist/Editor/utils/helper.js +31 -2
- package/dist/Editor/utils/table.js +51 -43
- package/package.json +4 -3
@@ -3,12 +3,12 @@ import { Checkbox, FormControlLabel, Grid, Slider, Typography, Box } from "@mui/
|
|
3
3
|
import { squreStyle } from "./radiusStyle";
|
4
4
|
import { getBreakPointsValue, getCustomizationValue } from "../../../helper/theme";
|
5
5
|
import useWindowResize from "../../../hooks/useWindowResize";
|
6
|
+
import { useEditorTheme } from "../../../hooks/useEditorTheme";
|
6
7
|
import { jsx as _jsx } from "react/jsx-runtime";
|
7
8
|
import { jsxs as _jsxs } from "react/jsx-runtime";
|
8
9
|
const BANNER_SPACING_KEYS = ["top", "left", "right", "bottom"];
|
9
10
|
const BannerSpacing = props => {
|
10
11
|
const {
|
11
|
-
value: val,
|
12
12
|
data,
|
13
13
|
onChange,
|
14
14
|
elementProps,
|
@@ -18,11 +18,21 @@ const BannerSpacing = props => {
|
|
18
18
|
key
|
19
19
|
} = data;
|
20
20
|
const lockKeyVal = `lock${key}`;
|
21
|
-
|
21
|
+
const [size] = useWindowResize();
|
22
|
+
const {
|
23
|
+
selectedTheme
|
24
|
+
} = useEditorTheme();
|
25
|
+
const {
|
26
|
+
bannerSpacing,
|
27
|
+
lockbannerSpacing
|
28
|
+
} = selectedTheme?.elementProps?.button || {};
|
29
|
+
const isUserValue = Object.keys(props?.value || {})?.length;
|
30
|
+
const isUserLockedSpacing = typeof elementProps[lockKeyVal] === "boolean";
|
31
|
+
const val = isUserValue ? props?.value : bannerSpacing;
|
32
|
+
let lockSpacing = isUserLockedSpacing ? elementProps[lockKeyVal] : lockbannerSpacing;
|
22
33
|
if (lockSpacing === undefined) {
|
23
34
|
lockSpacing = true;
|
24
35
|
}
|
25
|
-
const [size] = useWindowResize();
|
26
36
|
const value = getBreakPointsValue(val, size?.device);
|
27
37
|
const handleChange = e => {
|
28
38
|
let changeAll = {};
|
@@ -2,28 +2,36 @@ import React from "react";
|
|
2
2
|
import { Grid, Typography, Slider, FormControlLabel, Checkbox, Box } from "@mui/material";
|
3
3
|
import { radiusStyle } from "./radiusStyle";
|
4
4
|
import useWindowResize from "../../../hooks/useWindowResize";
|
5
|
+
import { useEditorTheme } from "../../../hooks/useEditorTheme";
|
5
6
|
import { getBreakPointsValue, getCustomizationValue } from "../../../helper/theme";
|
6
7
|
import { jsx as _jsx } from "react/jsx-runtime";
|
7
8
|
import { jsxs as _jsxs } from "react/jsx-runtime";
|
8
9
|
const BORDER_RADIUS_KEYS = ["topLeft", "topRight", "bottomLeft", "bottomRight"];
|
9
10
|
const BorderRadius = props => {
|
10
11
|
const {
|
11
|
-
value: val,
|
12
12
|
data,
|
13
13
|
onChange,
|
14
14
|
elementProps,
|
15
15
|
classes
|
16
16
|
} = props;
|
17
|
-
let {
|
18
|
-
lockRadius
|
19
|
-
} = elementProps;
|
20
|
-
if (lockRadius === undefined) {
|
21
|
-
lockRadius = true;
|
22
|
-
}
|
23
17
|
const {
|
24
18
|
key
|
25
19
|
} = data;
|
26
20
|
const [size] = useWindowResize();
|
21
|
+
const {
|
22
|
+
selectedTheme
|
23
|
+
} = useEditorTheme();
|
24
|
+
const {
|
25
|
+
borderRadius,
|
26
|
+
lockRadius: themeLockRadius
|
27
|
+
} = selectedTheme?.elementProps?.button || {};
|
28
|
+
const isUserValue = Object.keys(props?.value || {})?.length;
|
29
|
+
const isUserLockedRadius = typeof elementProps?.lockRadius === "boolean";
|
30
|
+
const val = isUserValue ? props?.value : borderRadius;
|
31
|
+
let lockRadius = isUserLockedRadius ? elementProps?.lockRadius : themeLockRadius;
|
32
|
+
if (lockRadius === undefined) {
|
33
|
+
lockRadius = true;
|
34
|
+
}
|
27
35
|
const value = getBreakPointsValue(val, size?.device);
|
28
36
|
const handleChange = e => {
|
29
37
|
let changeAll = {};
|
@@ -1,21 +1,42 @@
|
|
1
|
-
import React, { useEffect, useState } from "react";
|
1
|
+
import React, { useEffect, useMemo, useState } from "react";
|
2
2
|
import { Grid, TextField, InputAdornment, Typography } from "@mui/material";
|
3
3
|
import ColorPickerButton from "../../ColorPickerButton";
|
4
|
+
import { useSlateStatic } from "slate-react";
|
5
|
+
import { getElementStyle, getVariableValue } from "../../../helper/theme";
|
4
6
|
import { jsx as _jsx } from "react/jsx-runtime";
|
5
7
|
import { jsxs as _jsxs } from "react/jsx-runtime";
|
8
|
+
const MAP_STYLE_PROPS = {
|
9
|
+
bgColor: "background-color",
|
10
|
+
textColor: "color"
|
11
|
+
};
|
6
12
|
const Color = props => {
|
7
13
|
const {
|
8
|
-
value,
|
14
|
+
value: val,
|
9
15
|
data,
|
10
16
|
onChange,
|
11
|
-
classes
|
17
|
+
classes,
|
18
|
+
elementProps,
|
19
|
+
handleClose,
|
20
|
+
customProps
|
12
21
|
} = props;
|
13
22
|
const {
|
14
23
|
key,
|
15
|
-
label
|
16
|
-
hideGradient
|
24
|
+
label
|
17
25
|
} = data;
|
18
26
|
const [recentColors, setRecentColors] = useState({});
|
27
|
+
const editor = useSlateStatic();
|
28
|
+
const {
|
29
|
+
value,
|
30
|
+
inputValue
|
31
|
+
} = useMemo(() => {
|
32
|
+
const isVariable = val && val.startsWith("var");
|
33
|
+
const value = isVariable ? val : getElementStyle(editor, elementProps, MAP_STYLE_PROPS[key]);
|
34
|
+
const inputValue = isVariable ? getVariableValue(val) : getElementStyle(editor, elementProps, MAP_STYLE_PROPS[key]);
|
35
|
+
return {
|
36
|
+
value: value || val,
|
37
|
+
inputValue: inputValue || val
|
38
|
+
};
|
39
|
+
}, [editor, val]);
|
19
40
|
useEffect(() => {
|
20
41
|
const storedColors = JSON.parse(localStorage.getItem("recentColors"));
|
21
42
|
if (storedColors) {
|
@@ -57,7 +78,7 @@ const Color = props => {
|
|
57
78
|
children: label
|
58
79
|
}), /*#__PURE__*/_jsx(TextField, {
|
59
80
|
fullWidth: true,
|
60
|
-
value:
|
81
|
+
value: inputValue,
|
61
82
|
placeholder: `${label} color code`,
|
62
83
|
InputLabelProps: {
|
63
84
|
shrink: true
|
@@ -70,7 +91,8 @@ const Color = props => {
|
|
70
91
|
value: value,
|
71
92
|
onSave: onSave,
|
72
93
|
recentColors: recentColors[key],
|
73
|
-
|
94
|
+
handleClose: handleClose,
|
95
|
+
disableEditTheme: customProps?.disableEditTheme
|
74
96
|
})
|
75
97
|
})
|
76
98
|
}
|
@@ -1,19 +1,26 @@
|
|
1
|
-
import React from "react";
|
1
|
+
import React, { useMemo } from "react";
|
2
2
|
import { TextField, IconButton, Grid, Typography } from "@mui/material";
|
3
3
|
import { sizeMap } from "../../../utils/font.js";
|
4
4
|
import { TextMinusIcon, TextPlusIcon } from "../../../common/iconslist.js";
|
5
|
+
import { getElementStyle } from "../../../helper/theme.js";
|
6
|
+
import { useSlateStatic } from "slate-react";
|
5
7
|
import { jsx as _jsx } from "react/jsx-runtime";
|
6
8
|
import { jsxs as _jsxs } from "react/jsx-runtime";
|
7
9
|
const FontSize = props => {
|
8
10
|
const {
|
9
|
-
value,
|
11
|
+
value: val,
|
10
12
|
data,
|
11
|
-
onChange
|
13
|
+
onChange,
|
14
|
+
elementProps
|
12
15
|
} = props;
|
13
16
|
const {
|
14
17
|
key,
|
15
18
|
width
|
16
19
|
} = data;
|
20
|
+
const editor = useSlateStatic();
|
21
|
+
const value = useMemo(() => {
|
22
|
+
return getElementStyle(editor, elementProps, "font-size") || val;
|
23
|
+
}, [editor, val]);
|
17
24
|
const handleChange = e => {
|
18
25
|
let inc = parseInt(e.target.value) || 16;
|
19
26
|
inc = inc > 200 ? 200 : inc;
|
@@ -24,7 +31,9 @@ const FontSize = props => {
|
|
24
31
|
const getSizeVal = () => {
|
25
32
|
try {
|
26
33
|
const size = `${value}`?.indexOf("px") >= 0 ? value : sizeMap[value] || value;
|
27
|
-
|
34
|
+
const defaultSize = 16;
|
35
|
+
const val = parseInt(size || defaultSize);
|
36
|
+
return isNaN(val) ? defaultSize : val;
|
28
37
|
} catch (err) {
|
29
38
|
return "";
|
30
39
|
}
|
@@ -1,7 +1,8 @@
|
|
1
|
-
import React from "react";
|
1
|
+
import React, { useMemo } from "react";
|
2
2
|
import { FormControl, Grid, ListItemIcon, ListSubheader, MenuItem, Select, Typography } from "@mui/material";
|
3
|
-
import { getBreakPointsValue } from "../../../helper/theme";
|
3
|
+
import { getBreakPointsValue, getElementStyle } from "../../../helper/theme";
|
4
4
|
import useWindowResize from "../../../hooks/useWindowResize";
|
5
|
+
import { useSlateStatic } from "slate-react";
|
5
6
|
import { jsx as _jsx } from "react/jsx-runtime";
|
6
7
|
import { jsxs as _jsxs } from "react/jsx-runtime";
|
7
8
|
import { Fragment as _Fragment } from "react/jsx-runtime";
|
@@ -22,10 +23,19 @@ const TextOptions = props => {
|
|
22
23
|
isBreakpoint,
|
23
24
|
options,
|
24
25
|
renderOption,
|
25
|
-
width
|
26
|
+
width,
|
27
|
+
themeEnabled
|
26
28
|
} = data;
|
27
29
|
const [size] = useWindowResize();
|
28
|
-
const
|
30
|
+
const editor = useSlateStatic();
|
31
|
+
const value = useMemo(() => {
|
32
|
+
const userValue = isBreakpoint ? getBreakPointsValue(val, size?.device) : val;
|
33
|
+
if (themeEnabled) {
|
34
|
+
// editor takes a little amount of time to update the new style in element, in that case userValue will be returned
|
35
|
+
return getElementStyle(editor, elementProps, key) || userValue;
|
36
|
+
}
|
37
|
+
return userValue;
|
38
|
+
}, [editor, isBreakpoint, val, size?.device]);
|
29
39
|
const metaDataMappingOptions = metaMappings?.boards || [];
|
30
40
|
const updatedOption = elementProps?.metadatamapping ? [...options, ...metaDataMappingOptions] : options;
|
31
41
|
const handleChange = (e, d) => {
|