@flozy/editor 11.0.5 → 11.0.6
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 +28 -141
- package/dist/Editor/DialogWrapper.js +25 -31
- package/dist/Editor/Editor.css +11 -39
- package/dist/Editor/Elements/AI/PopoverAIInput.js +3 -11
- package/dist/Editor/Elements/AI/Styles.js +0 -1
- package/dist/Editor/Elements/Accordion/Accordion.js +22 -28
- package/dist/Editor/Elements/Accordion/AccordionButton.js +3 -12
- package/dist/Editor/Elements/AppHeader/AppHeader.js +3 -3
- package/dist/Editor/Elements/Attachments/Attachments.js +11 -153
- package/dist/Editor/Elements/Attachments/AttachmentsButton.js +3 -8
- package/dist/Editor/Elements/Button/EditorButton.js +7 -23
- 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 +454 -0
- package/dist/Editor/Elements/DataView/Layouts/DataTypes/Components/Select.js +55 -134
- package/dist/Editor/Elements/DataView/Layouts/DataTypes/Components/SelectV1.js +8 -7
- package/dist/Editor/Elements/DataView/Layouts/DataTypes/PersonType.js +3 -8
- package/dist/Editor/Elements/DataView/Layouts/Options/EditProperty.js +1 -1
- package/dist/Editor/Elements/DataView/Layouts/TableStyles.js +1 -1
- package/dist/Editor/Elements/Embed/Embed.js +43 -36
- package/dist/Editor/Elements/Embed/Image.js +23 -236
- package/dist/Editor/Elements/Embed/Video.js +15 -245
- package/dist/Editor/Elements/Form/Form.js +10 -16
- package/dist/Editor/Elements/Form/FormField.js +1 -1
- package/dist/Editor/Elements/Form/Workflow/Styles.js +22 -24
- package/dist/Editor/Elements/Form/Workflow/constant.js +1 -25
- package/dist/Editor/Elements/FreeGrid/FreeGrid.js +74 -31
- package/dist/Editor/Elements/FreeGrid/FreeGridBox.js +5 -9
- package/dist/Editor/Elements/FreeGrid/FreeGridItem.js +1 -3
- package/dist/Editor/Elements/FreeGrid/Options/More.js +7 -7
- package/dist/Editor/Elements/FreeGrid/styles.js +0 -15
- package/dist/Editor/Elements/Grid/GridItem.js +1 -1
- package/dist/Editor/Elements/PageSettings/PageSettingsButton.js +1 -2
- package/dist/Editor/Elements/Signature/SignatureOptions/TypeSignature.js +2 -3
- package/dist/Editor/Elements/Signature/SignaturePopup.js +6 -24
- package/dist/Editor/Elements/SimpleText/style.js +2 -2
- package/dist/Editor/Elements/Table/Table.js +4 -5
- package/dist/Editor/Elements/Table/TableCell.js +3 -10
- package/dist/Editor/Elements/Title/title.js +11 -10
- package/dist/Editor/Elements/TopBanner/TopBanner.js +2 -4
- package/dist/Editor/Elements/TopBanner/TopBannerButton.js +3 -5
- package/dist/Editor/Elements/Variables/VariableButton.js +1 -10
- package/dist/Editor/MiniEditor.js +1 -2
- package/dist/Editor/Styles/EditorStyles.js +5 -23
- 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 +29 -33
- 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 +23 -25
- package/dist/Editor/Toolbar/PopupTool/MiniTextFormat/SelectList.js +7 -25
- package/dist/Editor/Toolbar/PopupTool/MiniTextFormat/SelectTypography.js +42 -167
- package/dist/Editor/Toolbar/PopupTool/MiniTextFormat/index.js +8 -24
- package/dist/Editor/Toolbar/PopupTool/PopperHeader.js +1 -2
- package/dist/Editor/Toolbar/PopupTool/PopupToolStyle.js +10 -70
- package/dist/Editor/Toolbar/PopupTool/TextFormat.js +14 -73
- package/dist/Editor/Toolbar/PopupTool/index.js +4 -7
- package/dist/Editor/Toolbar/toolbarGroups.js +10 -56
- package/dist/Editor/common/ColorPickerButton.js +16 -38
- package/dist/Editor/common/DnD/DragHandleButton.js +1 -1
- package/dist/Editor/common/FontLoader/FontLoader.js +0 -4
- package/dist/Editor/common/Icon.js +0 -28
- package/dist/Editor/common/ImageSelector/ImageSelector.js +7 -45
- package/dist/Editor/common/ImageSelector/Options/Upload.js +11 -26
- package/dist/Editor/common/ImageSelector/Styles.js +9 -3
- package/dist/Editor/common/LinkSettings/NavComponents.js +2 -6
- package/dist/Editor/common/MentionsPopup/index.js +1 -9
- package/dist/Editor/common/RnD/ElementSettings/OtherSettings/Settings.js +1 -2
- 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 +7 -20
- package/dist/Editor/common/RnD/ElementSettings/Settings/TableSettings.js +2 -3
- package/dist/Editor/common/RnD/ElementSettings/Settings/TextSettings.js +1 -9
- package/dist/Editor/common/RnD/ElementSettings/Settings/VideoSettings.js +7 -20
- package/dist/Editor/common/RnD/GuideLines/styles.js +1 -1
- 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 +11 -28
- package/dist/Editor/common/RnD/Utils/index.js +1 -3
- package/dist/Editor/common/RnD/VirtualElement/VirtualTextElement.js +63 -52
- package/dist/Editor/common/RnD/VirtualElement/helper.js +130 -320
- package/dist/Editor/common/RnD/VirtualElement/styles.js +0 -22
- package/dist/Editor/common/RnD/index.js +14 -61
- package/dist/Editor/common/Shorthands/elements.js +4 -62
- package/dist/Editor/common/StyleBuilder/buttonStyle.js +2 -4
- package/dist/Editor/common/StyleBuilder/embedVideoStyle.js +0 -4
- package/dist/Editor/common/StyleBuilder/fieldStyle.js +0 -1
- package/dist/Editor/common/StyleBuilder/fieldTypes/backgroundImage.js +2 -15
- 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/menusArray.js +0 -2
- package/dist/Editor/common/StyleBuilder/fieldTypes/text.js +0 -1
- package/dist/Editor/common/StyleBuilder/fieldTypes/textOptions.js +7 -15
- package/dist/Editor/common/StyleBuilder/formStyle.js +13 -19
- package/dist/Editor/common/StyleBuilder/index.js +4 -8
- package/dist/Editor/common/Uploader.js +17 -125
- package/dist/Editor/common/iconslist.js +0 -21
- package/dist/Editor/commonStyle.js +63 -136
- package/dist/Editor/helper/index.js +2 -10
- package/dist/Editor/helper/theme.js +2 -203
- package/dist/Editor/hooks/useMouseMove.js +3 -9
- package/dist/Editor/hooks/useTable.js +1 -62
- package/dist/Editor/plugins/withEmbeds.js +1 -12
- package/dist/Editor/plugins/withHTML.js +3 -58
- package/dist/Editor/plugins/withTable.js +1 -1
- package/dist/Editor/service/fileupload.js +0 -70
- package/dist/Editor/theme/ThemeList.js +173 -50
- package/dist/Editor/utils/SlateUtilityFunctions.js +40 -192
- package/dist/Editor/utils/accordion.js +39 -67
- package/dist/Editor/utils/button.js +17 -1
- package/dist/Editor/utils/draftToSlate.js +2 -3
- package/dist/Editor/utils/events.js +89 -94
- package/dist/Editor/utils/font.js +37 -40
- package/dist/Editor/utils/formfield.js +2 -2
- package/dist/Editor/utils/helper.js +23 -100
- package/dist/Editor/utils/insertAppHeader.js +4 -8
- package/package.json +4 -4
- package/dist/Editor/Elements/Attachments/AttachmentStyles.js +0 -16
- package/dist/Editor/Elements/FreeGrid/helper.js +0 -194
- 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/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/RnD/Theme/MainThemeProvider.js +0 -17
- package/dist/Editor/common/StyleBuilder/fieldTypes/embedUpload.js +0 -115
- package/dist/Editor/common/UploaderWithProgress.js +0 -183
- 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
@@ -18,17 +18,6 @@ const useVirtualElementStyles = () => ({
|
|
18
18
|
"& .editor-blocker": {
|
19
19
|
display: "none"
|
20
20
|
},
|
21
|
-
"& .fgi_type_text": {
|
22
|
-
"& .edt-headings": {
|
23
|
-
margin: "0px"
|
24
|
-
},
|
25
|
-
"& .edt-paragraphs": {
|
26
|
-
margin: "0px"
|
27
|
-
},
|
28
|
-
"& blockquote": {
|
29
|
-
margin: "0px !important"
|
30
|
-
}
|
31
|
-
},
|
32
21
|
"& .freegrid-item": {
|
33
22
|
position: "relative !important",
|
34
23
|
top: "0 !important",
|
@@ -108,17 +97,6 @@ export const useAutoAlignStyles = () => ({
|
|
108
97
|
"&.type_text": {
|
109
98
|
height: "auto !important"
|
110
99
|
},
|
111
|
-
"& .fgi_type_text": {
|
112
|
-
"& .edt-headings": {
|
113
|
-
margin: "0px"
|
114
|
-
},
|
115
|
-
"& .edt-paragraphs": {
|
116
|
-
margin: "0px"
|
117
|
-
},
|
118
|
-
"& blockquote": {
|
119
|
-
margin: "0px !important"
|
120
|
-
}
|
121
|
-
},
|
122
100
|
// start - default signature classes on free-grid
|
123
101
|
"& .fgi_type_signature": {
|
124
102
|
height: "100%",
|
@@ -12,7 +12,7 @@ import GuideLines from "./GuideLines";
|
|
12
12
|
import ShadowElement from "./ShadowElement";
|
13
13
|
import BoundaryLine from "./GuideLines/BoundaryLine";
|
14
14
|
import ContextMenu from "./ContextMenu";
|
15
|
-
|
15
|
+
import VirtualElement from "./VirtualElement";
|
16
16
|
import { ItemTypes } from "./ElementSettings/settingsConstants";
|
17
17
|
import { selectText } from "../../utils/helper";
|
18
18
|
import { removeSign } from "./ElementSettings/OtherSettings";
|
@@ -20,7 +20,7 @@ import useDragging from "../../hooks/useDragging";
|
|
20
20
|
import { dragOverOn } from "../../helper/RnD/focusNode";
|
21
21
|
import { focusSelection, clearSelection, clearSelectionOnly } from "../../helper";
|
22
22
|
// import { reRenderChildNodes } from "./Utils/gridDropItem";
|
23
|
-
import VirtualTextElement
|
23
|
+
import VirtualTextElement from "./VirtualElement/VirtualTextElement";
|
24
24
|
import useAutoScroll from "../../hooks/useAutoScroll";
|
25
25
|
import ForceAutoAlignment from "./VirtualElement/ForceAutoAlignment";
|
26
26
|
import BoxHeaderAutoAlignment from "./VirtualElement/BoxHeaderAutoAlignment";
|
@@ -29,38 +29,6 @@ import { useFreeGrid } from "../../Elements/FreeGrid/FreeGrid";
|
|
29
29
|
import { jsx as _jsx } from "react/jsx-runtime";
|
30
30
|
import { jsxs as _jsxs } from "react/jsx-runtime";
|
31
31
|
import { Fragment as _Fragment } from "react/jsx-runtime";
|
32
|
-
function getTextElementHeight(textElement) {
|
33
|
-
let totalHeight = 0;
|
34
|
-
if (textElement) {
|
35
|
-
const {
|
36
|
-
childNodes
|
37
|
-
} = textElement || {};
|
38
|
-
for (let i = childNodes.length - 1; i >= 0; i--) {
|
39
|
-
const el = childNodes[i];
|
40
|
-
const text = el.textContent?.replace(/\n/g, "")?.trim();
|
41
|
-
if (text || totalHeight) {
|
42
|
-
// remove last empty spaces
|
43
|
-
totalHeight += el.offsetHeight || el.getBoundingClientRect().height;
|
44
|
-
}
|
45
|
-
}
|
46
|
-
}
|
47
|
-
return totalHeight;
|
48
|
-
}
|
49
|
-
function textAutoAlign(editor, path, getCurrentEle, delta, breakpoint, onLoad) {
|
50
|
-
const currElement = getCurrentEle();
|
51
|
-
const textElement = currElement?.querySelector(".fgi_type_text");
|
52
|
-
const clientHeight = getTextElementHeight(textElement);
|
53
|
-
const {
|
54
|
-
height
|
55
|
-
} = delta || {};
|
56
|
-
const heightDiff = Math.abs(clientHeight - height);
|
57
|
-
const autoAlign = onLoad ? clientHeight > height : heightDiff >= 5;
|
58
|
-
if (clientHeight && height && autoAlign) {
|
59
|
-
updateTextHeight(editor, path, clientHeight, breakpoint);
|
60
|
-
const parentSectionPath = path.slice(0, 2);
|
61
|
-
reRenderChildNodes(editor, parentSectionPath);
|
62
|
-
}
|
63
|
-
}
|
64
32
|
const ITEM_TYPES = ["child", "parent-container"];
|
65
33
|
const EDIT_MODES = ["text", "form", "table"];
|
66
34
|
const DISABLE_RESIZING = {
|
@@ -110,8 +78,7 @@ const RnD = props => {
|
|
110
78
|
setAutoAlign,
|
111
79
|
isBoxHeader,
|
112
80
|
customProps,
|
113
|
-
xsHidden
|
114
|
-
disableClick = false
|
81
|
+
xsHidden
|
115
82
|
} = props;
|
116
83
|
const {
|
117
84
|
isSelectedElement,
|
@@ -165,8 +132,6 @@ const RnD = props => {
|
|
165
132
|
const {
|
166
133
|
translation
|
167
134
|
} = customProps;
|
168
|
-
const timerId = useRef(0);
|
169
|
-
const isFirstRender = useRef(true);
|
170
135
|
useEffect(() => {
|
171
136
|
if (ITEM_TYPES.includes(type)) {
|
172
137
|
if (enable === 1) {
|
@@ -176,19 +141,6 @@ const RnD = props => {
|
|
176
141
|
setAbsPosition({});
|
177
142
|
}
|
178
143
|
}
|
179
|
-
if (childType === "text" && !enable && !readOnly) {
|
180
|
-
if (isFirstRender.current) {
|
181
|
-
isFirstRender.current = false;
|
182
|
-
timerId.current = setTimeout(() => {
|
183
|
-
// auto align on load
|
184
|
-
textAutoAlign(editor, path, getCurrentEle, delta, breakpoint, true);
|
185
|
-
}, 200);
|
186
|
-
} else {
|
187
|
-
// auto align when the text is changed
|
188
|
-
textAutoAlign(editor, path, getCurrentEle, delta, breakpoint);
|
189
|
-
}
|
190
|
-
}
|
191
|
-
return () => clearTimeout(timerId?.current);
|
192
144
|
}, [enable]);
|
193
145
|
const getCurrentEle = () => {
|
194
146
|
return positionRef.current?.resizableElement?.current;
|
@@ -548,9 +500,7 @@ const RnD = props => {
|
|
548
500
|
ref
|
549
501
|
}, ".freegrid-container-parent");
|
550
502
|
const formatParentPath = parentPath?.split("|")?.map(m => parseInt(m));
|
551
|
-
|
552
|
-
reRenderChildNodes(editor, formatParentPath);
|
553
|
-
}
|
503
|
+
reRenderChildNodes(editor, formatParentPath);
|
554
504
|
};
|
555
505
|
const onCloseSettings = () => {
|
556
506
|
setSelectedElement({
|
@@ -681,10 +631,7 @@ const RnD = props => {
|
|
681
631
|
"data-path": path,
|
682
632
|
contentEditable: false,
|
683
633
|
"data-dragoverid": str_path,
|
684
|
-
"data-dragovertype": type
|
685
|
-
style: {
|
686
|
-
pointerEvents: disableClick && "none"
|
687
|
-
}
|
634
|
+
"data-dragovertype": type
|
688
635
|
}) : null]
|
689
636
|
}, eId), xsHidden && breakpoint === "xs" ? null : /*#__PURE__*/_jsxs(_Fragment, {
|
690
637
|
children: [/*#__PURE__*/_jsx(ElementSettings, {
|
@@ -737,12 +684,18 @@ const RnD = props => {
|
|
737
684
|
handleClose: handleClose,
|
738
685
|
theme: theme,
|
739
686
|
translation: translation
|
740
|
-
}),
|
687
|
+
}), type === "parent" && breakpoint === "lg" && !readOnly ? /*#__PURE__*/_jsx(VirtualElement, {
|
688
|
+
updated_at: updated_at,
|
689
|
+
path: str_path,
|
690
|
+
editor: editor,
|
691
|
+
sectionElement: sectionElement,
|
692
|
+
sectionCls: `.freegrid-section_${path.join("_")}`,
|
693
|
+
dataSets: dataSets
|
694
|
+
}) : null, childType === "text" && breakpoint === "lg" && !readOnly && enable ? /*#__PURE__*/_jsx(VirtualTextElement, {
|
741
695
|
editor: editor,
|
742
696
|
dataSets: dataSets,
|
743
697
|
getCurrentEle: getCurrentEle,
|
744
|
-
path: path
|
745
|
-
breakpoint: breakpoint === "xs" ? "lg" : "xs" // auto-align for this passed breakpoint
|
698
|
+
path: path
|
746
699
|
}) : null, type === "parent" && breakpoint === "xs" && !readOnly && autoAlign ? /*#__PURE__*/_jsx(ForceAutoAlignment, {
|
747
700
|
updated_at: updated_at,
|
748
701
|
path: str_path,
|
@@ -55,60 +55,6 @@ const ELEMENTS_LIST = [{
|
|
55
55
|
icon: "headingThree"
|
56
56
|
}),
|
57
57
|
onInsert: editor => toggleBlock(editor, "headingThree", false)
|
58
|
-
}, {
|
59
|
-
name: "Heading 4",
|
60
|
-
desc: "",
|
61
|
-
group: "Text",
|
62
|
-
type: "headingFour",
|
63
|
-
icon: /*#__PURE__*/_jsx(Icon, {
|
64
|
-
icon: "headingFour"
|
65
|
-
}),
|
66
|
-
onInsert: editor => toggleBlock(editor, "headingFour", false)
|
67
|
-
}, {
|
68
|
-
name: "Heading 5",
|
69
|
-
desc: "",
|
70
|
-
group: "Text",
|
71
|
-
type: "headingFive",
|
72
|
-
icon: /*#__PURE__*/_jsx(Icon, {
|
73
|
-
icon: "headingFive"
|
74
|
-
}),
|
75
|
-
onInsert: editor => toggleBlock(editor, "headingFive", false)
|
76
|
-
}, {
|
77
|
-
name: "Heading 6",
|
78
|
-
desc: "",
|
79
|
-
group: "Text",
|
80
|
-
type: "headingSix",
|
81
|
-
icon: /*#__PURE__*/_jsx(Icon, {
|
82
|
-
icon: "headingSix"
|
83
|
-
}),
|
84
|
-
onInsert: editor => toggleBlock(editor, "headingSix", false)
|
85
|
-
}, {
|
86
|
-
name: "Paragraph 1",
|
87
|
-
desc: "",
|
88
|
-
group: "Text",
|
89
|
-
type: "paragraphOne",
|
90
|
-
icon: /*#__PURE__*/_jsx(Icon, {
|
91
|
-
icon: "paragraphOne"
|
92
|
-
}),
|
93
|
-
onInsert: editor => toggleBlock(editor, "paragraphOne", false)
|
94
|
-
}, {
|
95
|
-
name: "Paragraph 2",
|
96
|
-
desc: "",
|
97
|
-
group: "Text",
|
98
|
-
type: "paragraphTwo",
|
99
|
-
icon: /*#__PURE__*/_jsx(Icon, {
|
100
|
-
icon: "paragraphTwo"
|
101
|
-
}),
|
102
|
-
onInsert: editor => toggleBlock(editor, "paragraphTwo", false)
|
103
|
-
}, {
|
104
|
-
name: "Paragraph 3",
|
105
|
-
desc: "",
|
106
|
-
group: "Text",
|
107
|
-
type: "paragraphThree",
|
108
|
-
icon: /*#__PURE__*/_jsx(Icon, {
|
109
|
-
icon: "paragraphThree"
|
110
|
-
}),
|
111
|
-
onInsert: editor => toggleBlock(editor, "paragraphThree", false)
|
112
58
|
}, {
|
113
59
|
name: "Quote",
|
114
60
|
desc: "",
|
@@ -139,8 +85,7 @@ const ELEMENTS_LIST = [{
|
|
139
85
|
icon: /*#__PURE__*/_jsx(Icon, {
|
140
86
|
icon: "orderedList"
|
141
87
|
}),
|
142
|
-
onInsert: editor => toggleBlock(editor, "orderedList", false)
|
143
|
-
hideFor: ["accordion-summary"]
|
88
|
+
onInsert: editor => toggleBlock(editor, "orderedList", false)
|
144
89
|
}, {
|
145
90
|
name: "Bulleted List",
|
146
91
|
desc: "",
|
@@ -149,8 +94,7 @@ const ELEMENTS_LIST = [{
|
|
149
94
|
icon: /*#__PURE__*/_jsx(Icon, {
|
150
95
|
icon: "unorderedList"
|
151
96
|
}),
|
152
|
-
onInsert: editor => toggleBlock(editor, "unorderedList", false)
|
153
|
-
hideFor: ["accordion-summary"]
|
97
|
+
onInsert: editor => toggleBlock(editor, "unorderedList", false)
|
154
98
|
}, {
|
155
99
|
name: "Check List",
|
156
100
|
desc: "",
|
@@ -159,8 +103,7 @@ const ELEMENTS_LIST = [{
|
|
159
103
|
icon: /*#__PURE__*/_jsx(Icon, {
|
160
104
|
icon: "check-list-item"
|
161
105
|
}),
|
162
|
-
onInsert: editor => toggleBlock(editor, "check-list-item", false)
|
163
|
-
hideFor: ["accordion-summary"]
|
106
|
+
onInsert: editor => toggleBlock(editor, "check-list-item", false)
|
164
107
|
}, {
|
165
108
|
name: "Image",
|
166
109
|
desc: "",
|
@@ -297,8 +240,7 @@ const ELEMENTS_LIST = [{
|
|
297
240
|
onInsert: editor => {
|
298
241
|
Transforms.delete(editor, editor.selection); // remove text '/accordion' typed by user
|
299
242
|
insertAccordion(editor);
|
300
|
-
}
|
301
|
-
hideFor: ["unorderedList", "orderedList", "check-list-item"]
|
243
|
+
}
|
302
244
|
}, {
|
303
245
|
name: "Button",
|
304
246
|
group: "Elements",
|
@@ -21,8 +21,7 @@ const buttonStyle = [{
|
|
21
21
|
},
|
22
22
|
children: option.text
|
23
23
|
});
|
24
|
-
}
|
25
|
-
themeEnabled: true
|
24
|
+
}
|
26
25
|
}, {
|
27
26
|
label: "Font Size",
|
28
27
|
key: "textSize",
|
@@ -46,8 +45,7 @@ const buttonStyle = [{
|
|
46
45
|
}, {
|
47
46
|
label: "Button Color",
|
48
47
|
key: "bgColor",
|
49
|
-
type: "color"
|
50
|
-
themeEnabled: true
|
48
|
+
type: "color"
|
51
49
|
}, {
|
52
50
|
label: "Border Color",
|
53
51
|
key: "borderColor",
|
@@ -11,9 +11,7 @@ const BackgroundImage = props => {
|
|
11
11
|
value,
|
12
12
|
data,
|
13
13
|
customProps,
|
14
|
-
onChange
|
15
|
-
elementProps,
|
16
|
-
title
|
14
|
+
onChange
|
17
15
|
} = props;
|
18
16
|
const {
|
19
17
|
translation
|
@@ -27,7 +25,6 @@ const BackgroundImage = props => {
|
|
27
25
|
theme
|
28
26
|
} = useEditorContext();
|
29
27
|
const classes = UploadStyles(theme);
|
30
|
-
const disableProgress = title === "Page Settings" || elementProps?.type === "freegridBox" || elementProps?.type === "freegrid";
|
31
28
|
const onRemoveBG = () => {
|
32
29
|
setBase64(null);
|
33
30
|
onChange({
|
@@ -47,9 +44,6 @@ const BackgroundImage = props => {
|
|
47
44
|
});
|
48
45
|
handleClose();
|
49
46
|
};
|
50
|
-
const getTitle = () => {
|
51
|
-
return elementProps?.type === "image" ? "Image" : elementProps?.type === "video" ? "Video" : null;
|
52
|
-
};
|
53
47
|
return /*#__PURE__*/_jsxs(Grid, {
|
54
48
|
item: true,
|
55
49
|
xs: 12,
|
@@ -82,11 +76,6 @@ const BackgroundImage = props => {
|
|
82
76
|
children: translation("REMOVE")
|
83
77
|
}) : /*#__PURE__*/_jsx(Grid, {
|
84
78
|
className: "uploadImageText",
|
85
|
-
sx: {
|
86
|
-
padding: 0,
|
87
|
-
background: `${theme?.palette?.editor?.inputFieldBgColor}`,
|
88
|
-
border: `1px solid ${theme?.palette?.editor?.inputFieldBorder}`
|
89
|
-
},
|
90
79
|
children: /*#__PURE__*/_jsxs(Button, {
|
91
80
|
component: "label",
|
92
81
|
variant: "text",
|
@@ -111,9 +100,7 @@ const BackgroundImage = props => {
|
|
111
100
|
open: open,
|
112
101
|
onClose: handleClose,
|
113
102
|
customProps: customProps,
|
114
|
-
onSelectImage: onSelectImage
|
115
|
-
title: getTitle(),
|
116
|
-
disableProgress: disableProgress
|
103
|
+
onSelectImage: onSelectImage
|
117
104
|
})]
|
118
105
|
});
|
119
106
|
};
|
@@ -3,13 +3,13 @@ import { Checkbox, FormControlLabel, Grid, Slider, Typography, Box, IconButton }
|
|
3
3
|
import { squreStyle } from "./radiusStyle";
|
4
4
|
import { getBreakPointsValue } from "../../../helper/theme";
|
5
5
|
import useWindowResize from "../../../hooks/useWindowResize";
|
6
|
-
import { useEditorTheme } from "../../../hooks/useEditorTheme";
|
7
6
|
import { CheckedBoxCheckIcon } from "../../iconListV2";
|
8
7
|
import { jsx as _jsx } from "react/jsx-runtime";
|
9
8
|
import { jsxs as _jsxs } from "react/jsx-runtime";
|
10
9
|
const BANNER_SPACING_KEYS = ["top", "left", "right", "bottom"];
|
11
10
|
const BannerSpacing = props => {
|
12
11
|
const {
|
12
|
+
value: val,
|
13
13
|
data,
|
14
14
|
onChange,
|
15
15
|
elementProps,
|
@@ -23,17 +23,7 @@ const BannerSpacing = props => {
|
|
23
23
|
key
|
24
24
|
} = data;
|
25
25
|
const lockKeyVal = `lock${key}`;
|
26
|
-
|
27
|
-
selectedTheme
|
28
|
-
} = useEditorTheme();
|
29
|
-
const {
|
30
|
-
bannerSpacing,
|
31
|
-
lockbannerSpacing
|
32
|
-
} = selectedTheme?.elementProps[elementProps?.type] || {};
|
33
|
-
const isUserValue = Object.keys(props?.value || {})?.length;
|
34
|
-
const isUserLockedSpacing = typeof elementProps[lockKeyVal] === "boolean";
|
35
|
-
const val = isUserValue ? props?.value : bannerSpacing;
|
36
|
-
let lockSpacing = isUserLockedSpacing ? elementProps[lockKeyVal] : lockbannerSpacing;
|
26
|
+
let lockSpacing = elementProps[lockKeyVal];
|
37
27
|
if (lockSpacing === undefined) {
|
38
28
|
lockSpacing = true;
|
39
29
|
}
|
@@ -3,13 +3,13 @@ import { Grid, Typography, Slider, FormControlLabel, Checkbox, Box, IconButton }
|
|
3
3
|
import { radiusStyle } from "./radiusStyle";
|
4
4
|
import useWindowResize from "../../../hooks/useWindowResize";
|
5
5
|
import { getBreakPointsValue, getCustomizationValue } from "../../../helper/theme";
|
6
|
-
import { useEditorTheme } from "../../../hooks/useEditorTheme";
|
7
6
|
import { CheckedBoxCheckIcon } from "../../iconListV2";
|
8
7
|
import { jsx as _jsx } from "react/jsx-runtime";
|
9
8
|
import { jsxs as _jsxs } from "react/jsx-runtime";
|
10
9
|
const BORDER_RADIUS_KEYS = ["topLeft", "topRight", "bottomLeft", "bottomRight"];
|
11
10
|
const BorderRadius = props => {
|
12
11
|
const {
|
12
|
+
value: val,
|
13
13
|
data,
|
14
14
|
onChange,
|
15
15
|
elementProps,
|
@@ -19,24 +19,16 @@ const BorderRadius = props => {
|
|
19
19
|
const {
|
20
20
|
translation
|
21
21
|
} = customProps;
|
22
|
+
let {
|
23
|
+
lockRadius
|
24
|
+
} = elementProps;
|
25
|
+
if (lockRadius === undefined) {
|
26
|
+
lockRadius = true;
|
27
|
+
}
|
22
28
|
const {
|
23
29
|
key
|
24
30
|
} = data;
|
25
31
|
const [size] = useWindowResize();
|
26
|
-
const {
|
27
|
-
selectedTheme
|
28
|
-
} = useEditorTheme();
|
29
|
-
const {
|
30
|
-
borderRadius,
|
31
|
-
lockRadius: themeLockRadius
|
32
|
-
} = selectedTheme?.elementProps[elementProps?.type] || {};
|
33
|
-
const isUserValue = Object.keys(props?.value || {})?.length;
|
34
|
-
const isUserLockedRadius = typeof elementProps?.lockRadius === "boolean";
|
35
|
-
const val = isUserValue ? props?.value : borderRadius;
|
36
|
-
let lockRadius = isUserLockedRadius ? elementProps?.lockRadius : themeLockRadius;
|
37
|
-
if (lockRadius === undefined) {
|
38
|
-
lockRadius = true;
|
39
|
-
}
|
40
32
|
const value = getBreakPointsValue(val, size?.device);
|
41
33
|
const handleChange = e => {
|
42
34
|
let changeAll = {};
|
@@ -1,7 +1,6 @@
|
|
1
1
|
import { Box, Card, Checkbox, FormControlLabel, Grid, Tooltip, Typography } from "@mui/material";
|
2
2
|
import React from "react";
|
3
3
|
import Icon from "../../Icon";
|
4
|
-
import { useEditorContext } from "../../../hooks/useMouseMove";
|
5
4
|
import { jsx as _jsx } from "react/jsx-runtime";
|
6
5
|
import { Fragment as _Fragment } from "react/jsx-runtime";
|
7
6
|
import { jsxs as _jsxs } from "react/jsx-runtime";
|
@@ -16,17 +15,14 @@ const RenderCard = ({
|
|
16
15
|
}) => {
|
17
16
|
return /*#__PURE__*/_jsx(Card, {
|
18
17
|
sx: {
|
19
|
-
position:
|
20
|
-
padding: "10px"
|
21
|
-
"& .MuiCheckbox-root svg": {
|
22
|
-
fill: "unset !important"
|
23
|
-
}
|
18
|
+
position: 'relative',
|
19
|
+
padding: "10px"
|
24
20
|
},
|
25
21
|
children: /*#__PURE__*/_jsx(FormControlLabel, {
|
26
22
|
control: /*#__PURE__*/_jsx(Checkbox, {
|
27
23
|
sx: {
|
28
24
|
padding: 0,
|
29
|
-
marginTop:
|
25
|
+
marginTop: '3px'
|
30
26
|
},
|
31
27
|
onChange: handleChange,
|
32
28
|
checked: value,
|
@@ -62,10 +58,10 @@ const RenderCard = ({
|
|
62
58
|
})
|
63
59
|
}),
|
64
60
|
sx: {
|
65
|
-
width:
|
66
|
-
display:
|
67
|
-
justifyContent:
|
68
|
-
alignItems:
|
61
|
+
width: '100%',
|
62
|
+
display: 'flex',
|
63
|
+
justifyContent: 'space-between',
|
64
|
+
alignItems: 'flex-start',
|
69
65
|
margin: 0
|
70
66
|
},
|
71
67
|
labelPlacement: "start"
|
@@ -87,9 +83,6 @@ const CardsMapping = props => {
|
|
87
83
|
selectedCard,
|
88
84
|
infoIcon
|
89
85
|
} = data;
|
90
|
-
const {
|
91
|
-
theme
|
92
|
-
} = useEditorContext();
|
93
86
|
const {
|
94
87
|
translation
|
95
88
|
} = customProps;
|
@@ -111,8 +104,7 @@ const CardsMapping = props => {
|
|
111
104
|
sx: {
|
112
105
|
marginBottom: "12px",
|
113
106
|
"& .MuiPaper-root": {
|
114
|
-
|
115
|
-
border: activeCard ? "1px solid #2563EB" : `1px solid ${theme?.palette?.editor?.inputFieldBorder}`,
|
107
|
+
border: activeCard ? "1px solid #2563EB" : "1px solid #C8D8FA",
|
116
108
|
borderRadius: "8px",
|
117
109
|
boxShadow: activeCard ? "0px 4px 16px 0px #2563EB40" : "unset"
|
118
110
|
}
|
@@ -1,23 +1,14 @@
|
|
1
|
-
import React, { useEffect,
|
1
|
+
import React, { useEffect, useState } from "react";
|
2
2
|
import { Grid, TextField, InputAdornment, Typography, Tooltip } from "@mui/material";
|
3
3
|
import ColorPickerButton from "../../ColorPickerButton";
|
4
|
-
import { getVariableValue } from "../../../helper/theme";
|
5
|
-
import { useButtonStyle } from "../../../hooks/useThemeValues";
|
6
|
-
|
7
|
-
// const MAP_STYLE_PROPS = {
|
8
|
-
// bgColor: "background-color",
|
9
|
-
// textColor: "color",
|
10
|
-
// };
|
11
4
|
import { jsx as _jsx } from "react/jsx-runtime";
|
12
5
|
import { jsxs as _jsxs } from "react/jsx-runtime";
|
13
6
|
const Color = props => {
|
14
7
|
const {
|
15
|
-
value
|
8
|
+
value,
|
16
9
|
data,
|
17
10
|
onChange,
|
18
11
|
classes,
|
19
|
-
elementProps,
|
20
|
-
handleClose,
|
21
12
|
customProps
|
22
13
|
} = props;
|
23
14
|
const {
|
@@ -29,22 +20,7 @@ const Color = props => {
|
|
29
20
|
translation
|
30
21
|
} = customProps;
|
31
22
|
const [recentColors, setRecentColors] = useState({});
|
32
|
-
const
|
33
|
-
buttonStyle
|
34
|
-
} = useButtonStyle(val, key, elementProps);
|
35
|
-
const newValue = buttonStyle?.color;
|
36
|
-
const {
|
37
|
-
value,
|
38
|
-
inputValue
|
39
|
-
} = useMemo(() => {
|
40
|
-
const isVariable = newValue && newValue.startsWith("var");
|
41
|
-
const inputValue = isVariable ? getVariableValue(newValue) : newValue;
|
42
|
-
return {
|
43
|
-
value: newValue,
|
44
|
-
inputValue: inputValue
|
45
|
-
};
|
46
|
-
}, [buttonStyle?.color]);
|
47
|
-
const getLable = label === "Text" ? translation("selectTextColor") : label === "Background" ? translation("selectBgColor") : translation(label);
|
23
|
+
const getLable = label === 'Text' ? translation("selectTextColor") : label === 'Background' ? translation("selectBgColor") : translation(label);
|
48
24
|
useEffect(() => {
|
49
25
|
const storedColors = JSON.parse(localStorage.getItem("recentColors"));
|
50
26
|
if (storedColors) {
|
@@ -82,11 +58,11 @@ const Color = props => {
|
|
82
58
|
fontSize: "14px",
|
83
59
|
fontWeight: 500,
|
84
60
|
marginBottom: "5px",
|
85
|
-
display:
|
86
|
-
alignItems:
|
87
|
-
|
88
|
-
width:
|
89
|
-
height:
|
61
|
+
display: 'flex',
|
62
|
+
alignItems: 'center',
|
63
|
+
'& svg': {
|
64
|
+
width: '20px',
|
65
|
+
height: '20px'
|
90
66
|
}
|
91
67
|
},
|
92
68
|
children: [translation(label), data?.infoIcon ? /*#__PURE__*/_jsx(Tooltip, {
|
@@ -94,14 +70,14 @@ const Color = props => {
|
|
94
70
|
title: translation("noteText"),
|
95
71
|
children: /*#__PURE__*/_jsx("span", {
|
96
72
|
style: {
|
97
|
-
display:
|
73
|
+
display: 'inline-block'
|
98
74
|
},
|
99
75
|
children: data?.infoIcon
|
100
76
|
})
|
101
77
|
}) : null]
|
102
78
|
}), /*#__PURE__*/_jsx(TextField, {
|
103
79
|
fullWidth: true,
|
104
|
-
value:
|
80
|
+
value: value,
|
105
81
|
placeholder: getLable || `${label} ${translation("color code")}`,
|
106
82
|
InputLabelProps: {
|
107
83
|
shrink: true
|
@@ -114,8 +90,6 @@ const Color = props => {
|
|
114
90
|
value: value,
|
115
91
|
onSave: onSave,
|
116
92
|
recentColors: recentColors[key],
|
117
|
-
handleClose: handleClose,
|
118
|
-
disableEditTheme: customProps?.disableEditTheme,
|
119
93
|
hideGradient: hideGradient
|
120
94
|
})
|
121
95
|
})
|
@@ -1,30 +1,23 @@
|
|
1
|
-
import React
|
1
|
+
import React 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";
|
7
5
|
import { jsx as _jsx } from "react/jsx-runtime";
|
8
6
|
import { jsxs as _jsxs } from "react/jsx-runtime";
|
9
7
|
const FontSize = props => {
|
10
8
|
const {
|
11
|
-
value
|
9
|
+
value,
|
12
10
|
data,
|
13
11
|
onChange,
|
14
|
-
elementProps,
|
15
12
|
customProps
|
16
13
|
} = props;
|
14
|
+
const {
|
15
|
+
translation
|
16
|
+
} = customProps;
|
17
17
|
const {
|
18
18
|
key,
|
19
19
|
width
|
20
20
|
} = data;
|
21
|
-
const editor = useSlateStatic();
|
22
|
-
const value = useMemo(() => {
|
23
|
-
return val || getElementStyle(editor, elementProps, "font-size");
|
24
|
-
}, [editor, val]);
|
25
|
-
const {
|
26
|
-
translation
|
27
|
-
} = customProps;
|
28
21
|
const handleChange = e => {
|
29
22
|
let inc = parseInt(e.target.value) || 16;
|
30
23
|
inc = inc > 200 ? 200 : inc;
|
@@ -35,9 +28,7 @@ const FontSize = props => {
|
|
35
28
|
const getSizeVal = () => {
|
36
29
|
try {
|
37
30
|
const size = `${value}`?.indexOf("px") >= 0 ? value : sizeMap[value] || value;
|
38
|
-
|
39
|
-
const val = parseInt(size || defaultSize);
|
40
|
-
return isNaN(val) ? defaultSize : val;
|
31
|
+
return parseInt(size || 16);
|
41
32
|
} catch (err) {
|
42
33
|
return "";
|
43
34
|
}
|
@@ -86,7 +77,7 @@ const FontSize = props => {
|
|
86
77
|
size: "small",
|
87
78
|
inputProps: {
|
88
79
|
style: {
|
89
|
-
// textAlign: "center",
|
80
|
+
// textAlign: "center",
|
90
81
|
padding: "11px"
|
91
82
|
}
|
92
83
|
},
|
@@ -19,7 +19,6 @@ import SelectSwitch from "./selectSwitch";
|
|
19
19
|
import CardsMapping from "./card";
|
20
20
|
import MetaDataMapping from "./metaDataMapping";
|
21
21
|
import LineSpacing from "./lineSpacing";
|
22
|
-
import EmbedUpload from "./embedUpload";
|
23
22
|
const FieldMap = {
|
24
23
|
text: Text,
|
25
24
|
bannerSpacing: BannerSpacing,
|
@@ -41,7 +40,6 @@ const FieldMap = {
|
|
41
40
|
selectSwitch: SelectSwitch,
|
42
41
|
card: CardsMapping,
|
43
42
|
metadatamapping: MetaDataMapping,
|
44
|
-
lineSpacing: LineSpacing
|
45
|
-
embedUpload: EmbedUpload
|
43
|
+
lineSpacing: LineSpacing
|
46
44
|
};
|
47
45
|
export default FieldMap;
|