@flozy/editor 10.4.2 → 10.4.3
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 +16 -131
- package/dist/Editor/DialogWrapper.js +25 -31
- package/dist/Editor/Editor.css +8 -46
- package/dist/Editor/Elements/AI/PopoverAIInput.js +3 -11
- package/dist/Editor/Elements/Accordion/Accordion.js +9 -46
- package/dist/Editor/Elements/Accordion/AccordionSummary.js +23 -1
- package/dist/Editor/Elements/AppHeader/AppHeader.js +5 -10
- package/dist/Editor/Elements/Button/EditorButton.js +9 -27
- package/dist/Editor/Elements/Carousel/CarouselItem.js +1 -2
- 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/ColumnView.js +2 -4
- package/dist/Editor/Elements/DataView/Layouts/DataTypes/Components/MultiSelect.js +28 -30
- package/dist/Editor/Elements/DataView/Layouts/DataTypes/MultiSelectType.js +7 -9
- package/dist/Editor/Elements/DataView/Layouts/Options/AddOptions.js +1 -0
- package/dist/Editor/Elements/DataView/Layouts/ViewData.js +4 -8
- package/dist/Editor/Elements/Embed/Video.js +1 -1
- package/dist/Editor/Elements/Form/Form.js +3 -3
- package/dist/Editor/Elements/Form/FormElements/FormTextArea.js +1 -0
- package/dist/Editor/Elements/Form/FormField.js +2 -3
- package/dist/Editor/Elements/Form/Workflow/Styles.js +22 -24
- package/dist/Editor/Elements/FreeGrid/FreeGrid.js +31 -35
- package/dist/Editor/Elements/FreeGrid/FreeGridBox.js +4 -7
- package/dist/Editor/Elements/FreeGrid/FreeGridItem.js +0 -1
- package/dist/Editor/Elements/FreeGrid/Options/More.js +7 -7
- package/dist/Editor/Elements/FreeGrid/Options/sectionItemOptions.js +1 -1
- package/dist/Editor/Elements/FreeGrid/styles.js +0 -14
- package/dist/Editor/Elements/Grid/Grid.js +2 -14
- package/dist/Editor/Elements/Grid/GridItem.js +1 -1
- package/dist/Editor/Elements/Signature/Signature.css +1 -2
- package/dist/Editor/Elements/Signature/SignatureOptions/DrawSignature.js +5 -18
- package/dist/Editor/Elements/Signature/SignatureOptions/UploadSignature.js +3 -16
- package/dist/Editor/Elements/SimpleText/style.js +2 -2
- package/dist/Editor/Elements/Table/DragButton.js +1 -0
- package/dist/Editor/Elements/Table/Draggable.js +2 -6
- package/dist/Editor/Elements/Table/Styles.js +0 -7
- package/dist/Editor/Elements/Table/Table.js +3 -3
- package/dist/Editor/Elements/Table/TableCell.js +5 -24
- package/dist/Editor/Elements/Title/title.js +6 -6
- package/dist/Editor/Elements/Variables/VariableButton.js +1 -10
- package/dist/Editor/MiniEditor.js +1 -2
- package/dist/Editor/Styles/EditorStyles.js +5 -5
- 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 +13 -10
- 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 +13 -6
- package/dist/Editor/Toolbar/PopupTool/MiniTextFormat/SelectTypography.js +42 -167
- package/dist/Editor/Toolbar/PopupTool/MiniTextFormat/index.js +4 -7
- package/dist/Editor/Toolbar/PopupTool/PopperHeader.js +1 -2
- package/dist/Editor/Toolbar/PopupTool/PopupToolStyle.js +12 -72
- package/dist/Editor/Toolbar/PopupTool/TextFormat.js +10 -58
- package/dist/Editor/Toolbar/PopupTool/index.js +1 -1
- package/dist/Editor/Toolbar/toolbarGroups.js +6 -48
- package/dist/Editor/common/ColorPickerButton.js +16 -41
- package/dist/Editor/common/DnD/DragHandleButton.js +1 -1
- package/dist/Editor/common/FontLoader/FontLoader.js +0 -3
- package/dist/Editor/common/Icon.js +0 -28
- package/dist/Editor/common/ImageSelector/ImageSelector.js +2 -2
- package/dist/Editor/common/ImageSelector/Styles.js +9 -3
- package/dist/Editor/common/LinkSettings/NavComponents.js +66 -45
- package/dist/Editor/common/LinkSettings/index.js +29 -14
- package/dist/Editor/common/LinkSettings/navOptions.js +2 -2
- package/dist/Editor/common/LinkSettings/style.js +244 -164
- package/dist/Editor/common/MentionsPopup/index.js +1 -4
- package/dist/Editor/common/RnD/ElementOptions/Actions.js +5 -4
- package/dist/Editor/common/RnD/ElementSettings/OtherSettings/Settings.js +1 -2
- package/dist/Editor/common/RnD/ElementSettings/OtherSettings/Signature.js +3 -4
- 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 +2 -3
- package/dist/Editor/common/RnD/ElementSettings/Settings/TableSettings.js +2 -3
- package/dist/Editor/common/RnD/ElementSettings/Settings/TextSettings.js +1 -3
- package/dist/Editor/common/RnD/ElementSettings/Settings/VideoSettings.js +2 -3
- package/dist/Editor/common/RnD/ElementSettings/styles.js +1 -0
- package/dist/Editor/common/RnD/OptionsPopup/style.js +1 -0
- 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 +19 -28
- package/dist/Editor/common/RnD/Utils/index.js +1 -3
- package/dist/Editor/common/RnD/VirtualElement/VirtualTextElement.js +58 -42
- package/dist/Editor/common/RnD/VirtualElement/helper.js +132 -323
- package/dist/Editor/common/RnD/VirtualElement/styles.js +0 -16
- package/dist/Editor/common/RnD/index.js +39 -68
- package/dist/Editor/common/Select/index.js +7 -44
- package/dist/Editor/common/Select/styles.js +2 -30
- package/dist/Editor/common/Shorthands/elements.js +0 -54
- package/dist/Editor/common/StyleBuilder/accordionTitleBtnStyle.js +2 -2
- package/dist/Editor/common/StyleBuilder/accordionTitleStyle.js +9 -12
- package/dist/Editor/common/StyleBuilder/buttonStyle.js +2 -4
- package/dist/Editor/common/StyleBuilder/embedVideoStyle.js +0 -4
- package/dist/Editor/common/StyleBuilder/fieldTypes/backgroundImage.js +0 -5
- 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/textOptions.js +7 -15
- package/dist/Editor/common/SwipeableDrawer/style.js +12 -14
- package/dist/Editor/common/Uploader.js +0 -16
- package/dist/Editor/common/iconListV2.js +0 -76
- package/dist/Editor/common/iconslist.js +0 -21
- package/dist/Editor/commonStyle.js +61 -116
- package/dist/Editor/helper/index.js +1 -5
- package/dist/Editor/helper/theme.js +2 -203
- package/dist/Editor/hooks/useMouseMove.js +3 -9
- package/dist/Editor/hooks/useTable.js +4 -5
- package/dist/Editor/plugins/withEmbeds.js +1 -1
- package/dist/Editor/plugins/withHTML.js +1 -3
- package/dist/Editor/plugins/withTable.js +1 -1
- package/dist/Editor/theme/ThemeList.js +173 -50
- package/dist/Editor/utils/SlateUtilityFunctions.js +37 -161
- package/dist/Editor/utils/accordion.js +4 -14
- package/dist/Editor/utils/button.js +17 -1
- package/dist/Editor/utils/customHooks/useTableResize.js +9 -49
- package/dist/Editor/utils/draftToSlate.js +2 -3
- package/dist/Editor/utils/events.js +6 -50
- package/dist/Editor/utils/font.js +37 -40
- package/dist/Editor/utils/formfield.js +0 -1
- package/dist/Editor/utils/helper.js +26 -210
- package/dist/Editor/utils/insertAppHeader.js +1 -1
- package/dist/Editor/utils/signature.js +9 -2
- package/package.json +4 -4
- package/dist/Editor/Elements/FreeGrid/helper.js +0 -115
- 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/Checkbox/index.js +0 -46
- package/dist/Editor/common/Checkbox/styles.js +0 -45
- 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/RadioGroup/index.js +0 -48
- package/dist/Editor/common/RadioGroup/styles.js +0 -29
- package/dist/Editor/common/RnD/Theme/MainThemeProvider.js +0 -17
- package/dist/Editor/common/StyleBuilder/fieldTypes/embedUpload.js +0 -115
- 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
- package/dist/Editor/utils/updateFormName.js +0 -22
@@ -33,8 +33,7 @@ const MultiSelectWithPopover = props => {
|
|
33
33
|
onChange,
|
34
34
|
onUpdate,
|
35
35
|
property,
|
36
|
-
wrapColumn = false
|
37
|
-
translation
|
36
|
+
wrapColumn = false
|
38
37
|
} = props;
|
39
38
|
const [anchorEl, setAnchorEl] = useState(null);
|
40
39
|
const [anchorElOption, setAnchorElOption] = useState(null);
|
@@ -171,11 +170,11 @@ const MultiSelectWithPopover = props => {
|
|
171
170
|
variant: "filled",
|
172
171
|
sx: {
|
173
172
|
backgroundColor: option?.color,
|
174
|
-
color:
|
173
|
+
color: '#0F172A',
|
175
174
|
"& .MuiChip-deleteIcon": {
|
176
175
|
flexShrink: 0,
|
177
176
|
"& path": {
|
178
|
-
stroke:
|
177
|
+
stroke: '#0F172A !important'
|
179
178
|
}
|
180
179
|
},
|
181
180
|
"&:hover": {
|
@@ -222,9 +221,9 @@ const MultiSelectWithPopover = props => {
|
|
222
221
|
maxHeight: "250px",
|
223
222
|
overflowY: "auto",
|
224
223
|
overflowX: "hidden",
|
225
|
-
pr:
|
226
|
-
pl:
|
227
|
-
marginTop:
|
224
|
+
pr: '12px',
|
225
|
+
pl: '12px',
|
226
|
+
marginTop: '12px',
|
228
227
|
...customScrollStyles
|
229
228
|
}
|
230
229
|
},
|
@@ -282,11 +281,11 @@ const MultiSelectWithPopover = props => {
|
|
282
281
|
"& .MuiSvgIcon-root": {
|
283
282
|
fontSize: 20
|
284
283
|
},
|
285
|
-
|
284
|
+
'& rect': {
|
286
285
|
fill: theme?.palette?.editor?.closeButtonSvgStroke
|
287
286
|
},
|
288
|
-
|
289
|
-
backgroundColor:
|
287
|
+
'&:hover': {
|
288
|
+
backgroundColor: 'transparent'
|
290
289
|
}
|
291
290
|
},
|
292
291
|
children: /*#__PURE__*/_jsx(Icon, {
|
@@ -297,9 +296,9 @@ const MultiSelectWithPopover = props => {
|
|
297
296
|
},
|
298
297
|
sx: {
|
299
298
|
backgroundColor: "transparent",
|
300
|
-
fontFamily:
|
299
|
+
fontFamily: 'Inter',
|
301
300
|
fontWeight: 400,
|
302
|
-
fontSize:
|
301
|
+
fontSize: '12px'
|
303
302
|
},
|
304
303
|
placeholder: "Create new one..."
|
305
304
|
}),
|
@@ -315,11 +314,11 @@ const MultiSelectWithPopover = props => {
|
|
315
314
|
deleteIcon: /*#__PURE__*/_jsx(CloseIcon, {}),
|
316
315
|
sx: {
|
317
316
|
backgroundColor: option?.color,
|
318
|
-
color:
|
317
|
+
color: '#0F172A',
|
319
318
|
"& .MuiChip-deleteIcon": {
|
320
319
|
flexShrink: 0,
|
321
320
|
"& path": {
|
322
|
-
stroke:
|
321
|
+
stroke: '#0F172A !important'
|
323
322
|
}
|
324
323
|
},
|
325
324
|
"&:hover": {
|
@@ -329,13 +328,13 @@ const MultiSelectWithPopover = props => {
|
|
329
328
|
}, index))
|
330
329
|
}), /*#__PURE__*/_jsx(Divider, {
|
331
330
|
sx: {
|
332
|
-
mt:
|
331
|
+
mt: '12px',
|
333
332
|
borderBottom: `1px solid ${theme?.palette?.editor?.popUpBorderColor}`,
|
334
333
|
boxShadow: theme?.palette?.editor?.dividerDropShadow
|
335
334
|
}
|
336
335
|
}), /*#__PURE__*/_jsx(Box, {
|
337
336
|
sx: {
|
338
|
-
pl:
|
337
|
+
pl: '4px'
|
339
338
|
},
|
340
339
|
children: /*#__PURE__*/_jsxs(List, {
|
341
340
|
sx: {
|
@@ -346,11 +345,11 @@ const MultiSelectWithPopover = props => {
|
|
346
345
|
children: [/*#__PURE__*/_jsx(Typography, {
|
347
346
|
sx: {
|
348
347
|
mb: 1,
|
349
|
-
pl:
|
348
|
+
pl: '8px',
|
350
349
|
color: theme?.palette?.editor?.secondaryTextColor,
|
351
|
-
fontFamily:
|
350
|
+
fontFamily: 'Inter',
|
352
351
|
fontWeight: 400,
|
353
|
-
fontSize:
|
352
|
+
fontSize: '12px'
|
354
353
|
},
|
355
354
|
children: "Choose an option or create one"
|
356
355
|
}), filteredOptions?.map((option, index) => /*#__PURE__*/_jsx(ListItem, {
|
@@ -363,19 +362,19 @@ const MultiSelectWithPopover = props => {
|
|
363
362
|
sx: {
|
364
363
|
paddingTop: "4px",
|
365
364
|
paddingBottom: "4px",
|
366
|
-
justifyContent:
|
367
|
-
|
368
|
-
|
365
|
+
justifyContent: 'space-between',
|
366
|
+
'&:hover': {
|
367
|
+
'& path': {
|
369
368
|
stroke: theme?.palette?.editor?.activeColor
|
370
369
|
},
|
371
|
-
borderRadius:
|
370
|
+
borderRadius: '12px'
|
372
371
|
}
|
373
372
|
},
|
374
373
|
children: [/*#__PURE__*/_jsx(Chip, {
|
375
374
|
label: option?.value,
|
376
375
|
sx: {
|
377
376
|
backgroundColor: option?.color,
|
378
|
-
color:
|
377
|
+
color: '#0F172A',
|
379
378
|
fontWeight: 500,
|
380
379
|
fontSize: "12px",
|
381
380
|
fontFamily: "Inter",
|
@@ -389,11 +388,11 @@ const MultiSelectWithPopover = props => {
|
|
389
388
|
}), /*#__PURE__*/_jsx(IconButton, {
|
390
389
|
size: "small",
|
391
390
|
sx: {
|
392
|
-
|
391
|
+
'& path': {
|
393
392
|
stroke: theme?.palette?.editor?.closeButtonSvgStroke
|
394
393
|
},
|
395
|
-
|
396
|
-
backgroundColor:
|
394
|
+
'&:hover': {
|
395
|
+
backgroundColor: 'transparent'
|
397
396
|
}
|
398
397
|
},
|
399
398
|
onClick: e => handleEditOption(e, index),
|
@@ -422,7 +421,7 @@ const MultiSelectWithPopover = props => {
|
|
422
421
|
label: `${inputValue}`,
|
423
422
|
sx: {
|
424
423
|
backgroundColor: chipColor,
|
425
|
-
color:
|
424
|
+
color: '#0F172A',
|
426
425
|
fontWeight: 500,
|
427
426
|
fontSize: "12px",
|
428
427
|
fontFamily: "Inter",
|
@@ -443,8 +442,7 @@ const MultiSelectWithPopover = props => {
|
|
443
442
|
anchorEl: anchorElOption,
|
444
443
|
mode: mode,
|
445
444
|
onClose: onClose,
|
446
|
-
onEvent: onEditOption
|
447
|
-
translation: translation
|
445
|
+
onEvent: onEditOption
|
448
446
|
}) : null, showSnackBar ? /*#__PURE__*/_jsx(SnackbarAlert, {
|
449
447
|
message: "Option already selected!",
|
450
448
|
setShowSnackBar: setShowSnackBar
|
@@ -10,8 +10,7 @@ const MultiSelectType = props => {
|
|
10
10
|
options,
|
11
11
|
label = "",
|
12
12
|
readOnly,
|
13
|
-
settings
|
14
|
-
translation
|
13
|
+
settings
|
15
14
|
} = props;
|
16
15
|
const {
|
17
16
|
onChange,
|
@@ -34,11 +33,11 @@ const MultiSelectType = props => {
|
|
34
33
|
};
|
35
34
|
const handleUpdate = data => {
|
36
35
|
const updateData = {
|
37
|
-
label: "Multi Select",
|
38
|
-
visible: true,
|
39
|
-
key: property,
|
40
|
-
type: "multi-select",
|
41
|
-
options: data
|
36
|
+
"label": "Multi Select",
|
37
|
+
"visible": true,
|
38
|
+
"key": property,
|
39
|
+
"type": "multi-select",
|
40
|
+
"options": data
|
42
41
|
};
|
43
42
|
onUpdateProperty(updateData);
|
44
43
|
};
|
@@ -52,8 +51,7 @@ const MultiSelectType = props => {
|
|
52
51
|
placeholder: label,
|
53
52
|
disabled: readOnly,
|
54
53
|
property: property,
|
55
|
-
wrapColumn: wrapColumn
|
56
|
-
translation: translation
|
54
|
+
wrapColumn: wrapColumn
|
57
55
|
});
|
58
56
|
};
|
59
57
|
export default MultiSelectType;
|
@@ -11,8 +11,7 @@ const RenderRow = props => {
|
|
11
11
|
properties,
|
12
12
|
onSelect,
|
13
13
|
selected,
|
14
|
-
readOnly
|
15
|
-
translation
|
14
|
+
readOnly
|
16
15
|
} = props;
|
17
16
|
const showProperties = properties?.filter(f => f.visible);
|
18
17
|
return showProperties?.map((property, i) => {
|
@@ -23,8 +22,7 @@ const RenderRow = props => {
|
|
23
22
|
property: property,
|
24
23
|
onSelect: onSelect,
|
25
24
|
selected: selected,
|
26
|
-
readOnly: readOnly
|
27
|
-
translation: translation
|
25
|
+
readOnly: readOnly
|
28
26
|
}, `${property.key}_${i}`);
|
29
27
|
});
|
30
28
|
};
|
@@ -35,8 +33,7 @@ const ViewData = props => {
|
|
35
33
|
customProps
|
36
34
|
} = props;
|
37
35
|
const {
|
38
|
-
readOnly
|
39
|
-
translation
|
36
|
+
readOnly
|
40
37
|
} = customProps || {};
|
41
38
|
const {
|
42
39
|
properties,
|
@@ -70,8 +67,7 @@ const ViewData = props => {
|
|
70
67
|
properties: properties,
|
71
68
|
onSelect: onSelect,
|
72
69
|
selected: selectedRows?.includes(row?.id),
|
73
|
-
readOnly: readOnly
|
74
|
-
translation: translation
|
70
|
+
readOnly: readOnly
|
75
71
|
}), /*#__PURE__*/_jsx("td", {}), /*#__PURE__*/_jsx("td", {})]
|
76
72
|
}, i);
|
77
73
|
}), /*#__PURE__*/_jsx("tr", {
|
@@ -89,7 +89,7 @@ const VideoPlaceholder = props => {
|
|
89
89
|
},
|
90
90
|
children: [/*#__PURE__*/_jsx(Icon, {
|
91
91
|
icon: "video"
|
92
|
-
}),
|
92
|
+
}), TYPE_LABELS[type] || translation("Embed Video or Other")]
|
93
93
|
}) : /*#__PURE__*/_jsxs(Box, {
|
94
94
|
sx: {
|
95
95
|
color: "#64748B !important",
|
@@ -4,6 +4,7 @@ import { Node } from "slate";
|
|
4
4
|
import { useSlateStatic, ReactEditor } from "slate-react";
|
5
5
|
import { IconButton, Tooltip, Grid, Menu, MenuItem, CircularProgress, Box, Typography, useTheme } from "@mui/material";
|
6
6
|
import DeleteIcon from "@mui/icons-material/Delete";
|
7
|
+
import BackupIcon from "@mui/icons-material/Backup";
|
7
8
|
import { GridSettingsIcon, GridAddSectionIcon, WorkflowIcon } from "../../common/iconslist";
|
8
9
|
import FormPopup from "./FormPopup";
|
9
10
|
import ButtonPopup from "../Button/ButtonPopup";
|
@@ -159,8 +160,7 @@ const Form = props => {
|
|
159
160
|
[pair[0]]: pair[1],
|
160
161
|
placeholder: placeholder,
|
161
162
|
form_name: formName,
|
162
|
-
tagName: tagName
|
163
|
-
uid: fieldData?.uid
|
163
|
+
tagName: tagName
|
164
164
|
});
|
165
165
|
}
|
166
166
|
let params = {
|
@@ -207,7 +207,7 @@ const Form = props => {
|
|
207
207
|
}, {
|
208
208
|
at: path
|
209
209
|
});
|
210
|
-
// adding form field style to the current form node
|
210
|
+
// adding form field style to the current form node
|
211
211
|
const currentNode = Node.get(editor, path);
|
212
212
|
if (currentNode) {
|
213
213
|
currentNode.children.forEach((item, index) => {
|
@@ -1,5 +1,5 @@
|
|
1
1
|
import React, { useState } from "react";
|
2
|
-
import { Transforms } from "slate";
|
2
|
+
import { Transforms, Node } from "slate";
|
3
3
|
import { useSlateStatic, ReactEditor } from "slate-react";
|
4
4
|
import { IconButton, Tooltip, Grid, useTheme } from "@mui/material";
|
5
5
|
import FormElements from "./FormElements";
|
@@ -9,7 +9,6 @@ import { DeleteIcon } from "../../assets/svg/AIIcons";
|
|
9
9
|
import { SettingsIcon } from "../../assets/svg/TableIcons";
|
10
10
|
import { useEditorContext } from "../../hooks/useMouseMove";
|
11
11
|
import useCommonStyle from "../../commonStyle";
|
12
|
-
import { getNode } from "../../utils/helper";
|
13
12
|
import { jsx as _jsx } from "react/jsx-runtime";
|
14
13
|
import { jsxs as _jsxs } from "react/jsx-runtime";
|
15
14
|
const FormField = props => {
|
@@ -36,7 +35,7 @@ const FormField = props => {
|
|
36
35
|
const formPath = path.slice(0, path.length - 1);
|
37
36
|
const {
|
38
37
|
metadatamapping
|
39
|
-
} =
|
38
|
+
} = Node?.get(editor, formPath) || {};
|
40
39
|
const updatedElement = {
|
41
40
|
...element,
|
42
41
|
metadatamapping
|
@@ -9,20 +9,20 @@ const FormStyles = theme => ({
|
|
9
9
|
color: "#94A3B8"
|
10
10
|
},
|
11
11
|
bodyTextArea: {
|
12
|
-
|
13
|
-
padding:
|
14
|
-
|
15
|
-
outline:
|
16
|
-
border:
|
12
|
+
'& .mini-editor-cls': {
|
13
|
+
padding: '12px',
|
14
|
+
'&:focus-visible': {
|
15
|
+
outline: 'none',
|
16
|
+
border: 'none'
|
17
17
|
}
|
18
18
|
},
|
19
19
|
"& .editorWorkflow": {
|
20
|
-
minHeight:
|
21
|
-
padding:
|
20
|
+
minHeight: '130px',
|
21
|
+
padding: '12px',
|
22
22
|
paddingBottom: 0,
|
23
|
-
|
24
|
-
outline:
|
25
|
-
border:
|
23
|
+
'&:focus-visible': {
|
24
|
+
outline: 'none',
|
25
|
+
border: 'none'
|
26
26
|
}
|
27
27
|
}
|
28
28
|
},
|
@@ -105,7 +105,7 @@ const FormStyles = theme => ({
|
|
105
105
|
padding: "4px 22px",
|
106
106
|
textTransform: "none",
|
107
107
|
border: "1px solid #D8DDE1",
|
108
|
-
minWidth:
|
108
|
+
minWidth: '126px',
|
109
109
|
"& svg": {
|
110
110
|
"& path": {
|
111
111
|
stroke: "#64748B"
|
@@ -169,19 +169,17 @@ const FormStyles = theme => ({
|
|
169
169
|
}
|
170
170
|
},
|
171
171
|
colorButtonSingle: {
|
172
|
-
border: "1.5px solid #DCE4EC !important",
|
173
172
|
"&.active": {
|
174
|
-
|
175
|
-
|
176
|
-
|
177
|
-
|
178
|
-
|
179
|
-
|
180
|
-
|
181
|
-
|
182
|
-
|
183
|
-
|
184
|
-
outline: "2px solid #2563EB"
|
173
|
+
"&:before": {
|
174
|
+
content: '" "',
|
175
|
+
position: "absolute",
|
176
|
+
top: "-5px",
|
177
|
+
left: "-5px",
|
178
|
+
width: "calc(100% + 4px)",
|
179
|
+
height: "calc(100% + 4px)",
|
180
|
+
border: "3px solid blue",
|
181
|
+
borderRadius: "50%"
|
182
|
+
}
|
185
183
|
}
|
186
184
|
},
|
187
185
|
colorButtonsInner: {
|
@@ -251,7 +249,7 @@ const FormStyles = theme => ({
|
|
251
249
|
}
|
252
250
|
},
|
253
251
|
root: {
|
254
|
-
padding:
|
252
|
+
padding: '10px'
|
255
253
|
}
|
256
254
|
});
|
257
255
|
export default FormStyles;
|
@@ -22,8 +22,6 @@ import { DEFAULT_TABLE_NODE } from "../../utils/table";
|
|
22
22
|
import itemOptions from "./Options/sectionItemOptions";
|
23
23
|
import { getBreakPointsValue, groupByBreakpoint } from "../../helper/theme";
|
24
24
|
import { useDebouncedCallback } from "use-debounce";
|
25
|
-
import { getNewElementXsValues } from "./helper";
|
26
|
-
import updateFormName from "../../utils/updateFormName";
|
27
25
|
import { jsx as _jsx } from "react/jsx-runtime";
|
28
26
|
import { jsxs as _jsxs } from "react/jsx-runtime";
|
29
27
|
const MAX_DEVICE_WIDTH = {
|
@@ -142,10 +140,8 @@ const FreeGrid = props => {
|
|
142
140
|
});
|
143
141
|
break;
|
144
142
|
case "duplicateSection":
|
145
|
-
const currentNode = Node.get(editor, cur_root_path);
|
146
|
-
const updatedFormNameNode = updateFormName(currentNode);
|
147
143
|
Transforms.insertNodes(editor, [{
|
148
|
-
...JSON.parse(JSON.stringify(
|
144
|
+
...JSON.parse(JSON.stringify(Node.get(editor, cur_root_path)))
|
149
145
|
}], {
|
150
146
|
at: next_path
|
151
147
|
});
|
@@ -184,10 +180,6 @@ const FreeGrid = props => {
|
|
184
180
|
const handleAddElementClick = type => () => {
|
185
181
|
const isEmpty = isEmptySection();
|
186
182
|
const insertAt = isEmpty ? [...path, 0] : [...path, childrenCountRef.current];
|
187
|
-
const {
|
188
|
-
xsVal,
|
189
|
-
sectionHeightXs
|
190
|
-
} = getNewElementXsValues(type, element?.children);
|
191
183
|
switch (type) {
|
192
184
|
case "addText":
|
193
185
|
Transforms.insertNodes(editor, [{
|
@@ -204,8 +196,7 @@ const FreeGrid = props => {
|
|
204
196
|
marginTop: 0,
|
205
197
|
top: 0,
|
206
198
|
width: 170,
|
207
|
-
height: 30
|
208
|
-
...(xsVal || {})
|
199
|
+
height: 30
|
209
200
|
}], {
|
210
201
|
at: [...insertAt]
|
211
202
|
});
|
@@ -223,6 +214,20 @@ const FreeGrid = props => {
|
|
223
214
|
linkType: "webAddress"
|
224
215
|
},
|
225
216
|
iconPosition: "start",
|
217
|
+
bgColor: "#2563EB",
|
218
|
+
textColor: "#FFF",
|
219
|
+
borderRadius: {
|
220
|
+
topLeft: 30,
|
221
|
+
topRight: 30,
|
222
|
+
bottomLeft: 30,
|
223
|
+
bottomRight: 30
|
224
|
+
},
|
225
|
+
bannerSpacing: {
|
226
|
+
left: 12,
|
227
|
+
top: 12,
|
228
|
+
right: 12,
|
229
|
+
bottom: 12
|
230
|
+
},
|
226
231
|
textAlign: "center",
|
227
232
|
label: "Get Started"
|
228
233
|
}],
|
@@ -231,8 +236,7 @@ const FreeGrid = props => {
|
|
231
236
|
marginTop: 0,
|
232
237
|
top: 0,
|
233
238
|
width: 143,
|
234
|
-
height: 50
|
235
|
-
...(xsVal || {})
|
239
|
+
height: 50
|
236
240
|
}], {
|
237
241
|
at: [...insertAt]
|
238
242
|
});
|
@@ -258,9 +262,8 @@ const FreeGrid = props => {
|
|
258
262
|
top: 0,
|
259
263
|
width: 217,
|
260
264
|
height: 173,
|
261
|
-
|
262
|
-
|
263
|
-
...(xsVal || {})
|
265
|
+
width_xs: 217,
|
266
|
+
height_xs: 173
|
264
267
|
}], {
|
265
268
|
at: [...insertAt]
|
266
269
|
});
|
@@ -283,8 +286,7 @@ const FreeGrid = props => {
|
|
283
286
|
marginTop: 0,
|
284
287
|
top: 0,
|
285
288
|
width: 170,
|
286
|
-
height: 80
|
287
|
-
...(xsVal || {})
|
289
|
+
height: 80
|
288
290
|
}], {
|
289
291
|
at: [...insertAt]
|
290
292
|
});
|
@@ -297,8 +299,7 @@ const FreeGrid = props => {
|
|
297
299
|
images: []
|
298
300
|
}), {
|
299
301
|
height: 370,
|
300
|
-
width: 650
|
301
|
-
...(xsVal || {})
|
302
|
+
width: 650
|
302
303
|
})
|
303
304
|
}], {
|
304
305
|
at: [...insertAt]
|
@@ -310,8 +311,7 @@ const FreeGrid = props => {
|
|
310
311
|
...DEFAULT_TABLE_NODE()
|
311
312
|
}, {
|
312
313
|
height: 150,
|
313
|
-
width: 400
|
314
|
-
...(xsVal || {})
|
314
|
+
width: 400
|
315
315
|
})
|
316
316
|
}], {
|
317
317
|
at: [...insertAt]
|
@@ -335,8 +335,7 @@ const FreeGrid = props => {
|
|
335
335
|
marginTop: 0,
|
336
336
|
top: 0,
|
337
337
|
width: 400,
|
338
|
-
height: 300
|
339
|
-
...(xsVal || {})
|
338
|
+
height: 300
|
340
339
|
}], {
|
341
340
|
at: [...insertAt]
|
342
341
|
});
|
@@ -348,9 +347,7 @@ const FreeGrid = props => {
|
|
348
347
|
children: [{
|
349
348
|
text: ""
|
350
349
|
}]
|
351
|
-
}, {
|
352
|
-
...(xsVal || {})
|
353
|
-
}, "freegridBox")
|
350
|
+
}, {}, "freegridBox")
|
354
351
|
}], {
|
355
352
|
at: [...insertAt]
|
356
353
|
});
|
@@ -361,8 +358,7 @@ const FreeGrid = props => {
|
|
361
358
|
...FORM_NODE()
|
362
359
|
}, {
|
363
360
|
height: 92,
|
364
|
-
width: 400
|
365
|
-
...(xsVal || {})
|
361
|
+
width: 400
|
366
362
|
})
|
367
363
|
}], {
|
368
364
|
at: [...insertAt]
|
@@ -376,8 +372,7 @@ const FreeGrid = props => {
|
|
376
372
|
})
|
377
373
|
}, {
|
378
374
|
height: 60,
|
379
|
-
width: 400
|
380
|
-
...(xsVal || {})
|
375
|
+
width: 400
|
381
376
|
})
|
382
377
|
}], {
|
383
378
|
at: [...insertAt]
|
@@ -398,18 +393,19 @@ const FreeGrid = props => {
|
|
398
393
|
marginTop: 0,
|
399
394
|
top: 0,
|
400
395
|
width: 170,
|
401
|
-
height: 30
|
402
|
-
...(xsVal || {})
|
396
|
+
height: 30
|
403
397
|
}], {
|
404
398
|
at: [...insertAt]
|
405
399
|
});
|
406
400
|
break;
|
407
401
|
default:
|
408
402
|
}
|
409
|
-
if (
|
403
|
+
if (breakpoint === "lg") {
|
410
404
|
setSelectedElement({});
|
405
|
+
|
406
|
+
// auto align in mobile
|
411
407
|
Transforms.setNodes(editor, {
|
412
|
-
|
408
|
+
xs_updatedOn: null,
|
413
409
|
updated_at: new Date().getTime()
|
414
410
|
}, {
|
415
411
|
at: path
|
@@ -8,7 +8,7 @@ import { onDropItem, ROW_HEIGHT } from "../../common/RnD/Utils/gridDropItem";
|
|
8
8
|
import useBreakpoints from "../../hooks/useBreakpoints";
|
9
9
|
import { breakpointValues, formatBreakpointValues } from "./breakpointConstants";
|
10
10
|
import { useEditorContext } from "../../hooks/useMouseMove";
|
11
|
-
import { getBreakPointsValue
|
11
|
+
import { getBreakPointsValue } from "../../helper/theme";
|
12
12
|
import focusOnNewItem from "../../helper/RnD/focusOnNewItem";
|
13
13
|
import { bringItemToFB } from "../../helper";
|
14
14
|
import itemOptions from "./Options/sectionItemOptions";
|
@@ -160,11 +160,6 @@ const FreeGridBox = props => {
|
|
160
160
|
const isBoxHeader = useMemo(() => {
|
161
161
|
return element?.children?.some(c => c.childType === "appHeader" && !c.xs_updatedOn);
|
162
162
|
}, [element]);
|
163
|
-
const boxSp = groupByBreakpoint({
|
164
|
-
borderRadius: {
|
165
|
-
...getBreakPointsValue(sectionBorderRadius || {}, null, "overrideBorderRadius", true)
|
166
|
-
}
|
167
|
-
}, theme);
|
168
163
|
return /*#__PURE__*/_jsx(RnD, {
|
169
164
|
id: `freegrid_box_item_${path.join("|")}_${updated_at}_${breakpoint}`,
|
170
165
|
className: `freegrid-item path-${path.length} breakpoint-${breakpoint} freegrid-box_${path.join("_")}`,
|
@@ -231,7 +226,9 @@ const FreeGridBox = props => {
|
|
231
226
|
"--rows": `repeat(${repeatTimes}, ${ROW_HEIGHT}px)`
|
232
227
|
},
|
233
228
|
sx: {
|
234
|
-
|
229
|
+
borderRadius: {
|
230
|
+
...getBreakPointsValue(sectionBorderRadius || {}, null, "overrideBorderRadius", true)
|
231
|
+
},
|
235
232
|
background: sectionBgColor,
|
236
233
|
backgroundImage: sectionBackgroundImage ? `url('${sectionBackgroundImage}')` : "",
|
237
234
|
borderColor: borderColor || "transparent",
|
@@ -5,8 +5,8 @@ import { jsxs as _jsxs } from "react/jsx-runtime";
|
|
5
5
|
const More = props => {
|
6
6
|
const {
|
7
7
|
handleClick,
|
8
|
-
|
9
|
-
|
8
|
+
breakpoint,
|
9
|
+
translation
|
10
10
|
} = props;
|
11
11
|
return /*#__PURE__*/_jsx(Box, {
|
12
12
|
children: /*#__PURE__*/_jsxs(List, {
|
@@ -19,15 +19,15 @@ const More = props => {
|
|
19
19
|
className: "item-wrapper",
|
20
20
|
onClick: handleClick("duplicateSection"),
|
21
21
|
children: translation?.translation("Duplicate Section")
|
22
|
+
}), /*#__PURE__*/_jsx(ListItemButton, {
|
23
|
+
className: "item-wrapper",
|
24
|
+
onClick: handleClick("deleteSection"),
|
25
|
+
children: "Delete Section"
|
22
26
|
}), breakpoint === "xs" ? /*#__PURE__*/_jsx(ListItemButton, {
|
23
27
|
className: "item-wrapper",
|
24
28
|
onClick: handleClick("forceAutoAlignment"),
|
25
29
|
children: "Force Auto Alignment"
|
26
|
-
}) : null
|
27
|
-
className: "item-wrapper",
|
28
|
-
onClick: handleClick("deleteSection"),
|
29
|
-
children: "Delete Section"
|
30
|
-
})]
|
30
|
+
}) : null]
|
31
31
|
})
|
32
32
|
});
|
33
33
|
};
|
@@ -3,7 +3,7 @@ const textOptions = ["edit", "settings", "link", "saveAsTemplate", "close"];
|
|
3
3
|
const buttonOptions = ["settings", "link", "saveAsTemplate", "close"];
|
4
4
|
const imageOptions = ["settings", "link", "imageFrame", "saveAsTemplate", "close"];
|
5
5
|
const videoOptions = ["settings", "saveAsTemplate", "close"];
|
6
|
-
const boxOptions = ["settings", "
|
6
|
+
const boxOptions = ["settings", "saveAsTemplate", "close"];
|
7
7
|
const appHeaderOptions = ["settings", "saveAsTemplate", "close"];
|
8
8
|
const tableOptions = ["drag", "edit", "settings", "saveAsTemplate", "close"];
|
9
9
|
const embedScriptOptions = ["embedScript", "saveAsTemplate", "close"];
|