@flozy/editor 10.4.1 → 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.
Files changed (167) hide show
  1. package/dist/Editor/ChatEditor.js +16 -17
  2. package/dist/Editor/CommonEditor.js +16 -131
  3. package/dist/Editor/DialogWrapper.js +25 -31
  4. package/dist/Editor/Editor.css +8 -46
  5. package/dist/Editor/Elements/AI/PopoverAIInput.js +3 -11
  6. package/dist/Editor/Elements/Accordion/Accordion.js +9 -46
  7. package/dist/Editor/Elements/Accordion/AccordionSummary.js +23 -1
  8. package/dist/Editor/Elements/AppHeader/AppHeader.js +5 -10
  9. package/dist/Editor/Elements/Button/EditorButton.js +9 -27
  10. package/dist/Editor/Elements/Carousel/CarouselItem.js +1 -2
  11. package/dist/Editor/Elements/Color Picker/ColorButtons.js +14 -61
  12. package/dist/Editor/Elements/Color Picker/ColorPicker.css +1 -25
  13. package/dist/Editor/Elements/Color Picker/ColorPicker.js +7 -10
  14. package/dist/Editor/Elements/Color Picker/Styles.js +13 -15
  15. package/dist/Editor/Elements/DataView/Layouts/ColumnView.js +2 -4
  16. package/dist/Editor/Elements/DataView/Layouts/DataTypes/Components/MultiSelect.js +28 -30
  17. package/dist/Editor/Elements/DataView/Layouts/DataTypes/MultiSelectType.js +7 -9
  18. package/dist/Editor/Elements/DataView/Layouts/Options/AddOptions.js +1 -0
  19. package/dist/Editor/Elements/DataView/Layouts/ViewData.js +4 -8
  20. package/dist/Editor/Elements/Embed/Video.js +1 -1
  21. package/dist/Editor/Elements/Form/Form.js +3 -3
  22. package/dist/Editor/Elements/Form/FormElements/FormTextArea.js +1 -0
  23. package/dist/Editor/Elements/Form/FormField.js +2 -3
  24. package/dist/Editor/Elements/Form/Workflow/Styles.js +22 -24
  25. package/dist/Editor/Elements/FreeGrid/FreeGrid.js +31 -35
  26. package/dist/Editor/Elements/FreeGrid/FreeGridBox.js +4 -7
  27. package/dist/Editor/Elements/FreeGrid/FreeGridItem.js +0 -1
  28. package/dist/Editor/Elements/FreeGrid/Options/More.js +7 -7
  29. package/dist/Editor/Elements/FreeGrid/Options/sectionItemOptions.js +1 -1
  30. package/dist/Editor/Elements/FreeGrid/styles.js +0 -14
  31. package/dist/Editor/Elements/Grid/Grid.js +2 -14
  32. package/dist/Editor/Elements/Grid/GridItem.js +1 -1
  33. package/dist/Editor/Elements/Signature/Signature.css +1 -2
  34. package/dist/Editor/Elements/Signature/SignatureOptions/DrawSignature.js +5 -18
  35. package/dist/Editor/Elements/Signature/SignatureOptions/UploadSignature.js +3 -16
  36. package/dist/Editor/Elements/SimpleText/style.js +2 -2
  37. package/dist/Editor/Elements/Table/DragButton.js +1 -0
  38. package/dist/Editor/Elements/Table/Draggable.js +2 -6
  39. package/dist/Editor/Elements/Table/Styles.js +0 -7
  40. package/dist/Editor/Elements/Table/Table.js +3 -3
  41. package/dist/Editor/Elements/Table/TableCell.js +5 -24
  42. package/dist/Editor/Elements/Title/title.js +6 -6
  43. package/dist/Editor/Elements/Variables/VariableButton.js +1 -10
  44. package/dist/Editor/MiniEditor.js +1 -2
  45. package/dist/Editor/Styles/EditorStyles.js +5 -5
  46. package/dist/Editor/Toolbar/FormatTools/Dropdown.js +3 -27
  47. package/dist/Editor/Toolbar/FormatTools/FontFamilyAutocomplete.js +3 -4
  48. package/dist/Editor/Toolbar/FormatTools/MarkButton.js +2 -2
  49. package/dist/Editor/Toolbar/FormatTools/TextSize.js +13 -10
  50. package/dist/Editor/Toolbar/Mini/MiniToolbar.js +1 -2
  51. package/dist/Editor/Toolbar/PopupTool/MiniTextFormat/MiniColorPicker.js +2 -4
  52. package/dist/Editor/Toolbar/PopupTool/MiniTextFormat/SelectFontSize.js +13 -6
  53. package/dist/Editor/Toolbar/PopupTool/MiniTextFormat/SelectTypography.js +42 -167
  54. package/dist/Editor/Toolbar/PopupTool/MiniTextFormat/index.js +4 -7
  55. package/dist/Editor/Toolbar/PopupTool/PopperHeader.js +1 -2
  56. package/dist/Editor/Toolbar/PopupTool/PopupToolStyle.js +12 -72
  57. package/dist/Editor/Toolbar/PopupTool/TextFormat.js +10 -58
  58. package/dist/Editor/Toolbar/PopupTool/index.js +1 -1
  59. package/dist/Editor/Toolbar/toolbarGroups.js +6 -48
  60. package/dist/Editor/common/ColorPickerButton.js +16 -41
  61. package/dist/Editor/common/DnD/DragHandleButton.js +1 -1
  62. package/dist/Editor/common/FontLoader/FontLoader.js +0 -3
  63. package/dist/Editor/common/Icon.js +0 -28
  64. package/dist/Editor/common/ImageSelector/ImageSelector.js +2 -2
  65. package/dist/Editor/common/ImageSelector/Styles.js +9 -3
  66. package/dist/Editor/common/LinkSettings/NavComponents.js +66 -45
  67. package/dist/Editor/common/LinkSettings/index.js +28 -14
  68. package/dist/Editor/common/LinkSettings/navOptions.js +2 -2
  69. package/dist/Editor/common/LinkSettings/style.js +244 -164
  70. package/dist/Editor/common/MentionsPopup/index.js +1 -4
  71. package/dist/Editor/common/RnD/ElementOptions/Actions.js +5 -4
  72. package/dist/Editor/common/RnD/ElementSettings/OtherSettings/Settings.js +1 -2
  73. package/dist/Editor/common/RnD/ElementSettings/OtherSettings/Signature.js +3 -4
  74. package/dist/Editor/common/RnD/ElementSettings/Settings/AppHeaderSettings.js +2 -3
  75. package/dist/Editor/common/RnD/ElementSettings/Settings/BoxSettings.js +2 -3
  76. package/dist/Editor/common/RnD/ElementSettings/Settings/ButtonSettings.js +2 -3
  77. package/dist/Editor/common/RnD/ElementSettings/Settings/CodeSettings.js +2 -3
  78. package/dist/Editor/common/RnD/ElementSettings/Settings/FormSettings.js +2 -4
  79. package/dist/Editor/common/RnD/ElementSettings/Settings/ImageSettings.js +2 -3
  80. package/dist/Editor/common/RnD/ElementSettings/Settings/TableSettings.js +2 -3
  81. package/dist/Editor/common/RnD/ElementSettings/Settings/TextSettings.js +1 -3
  82. package/dist/Editor/common/RnD/ElementSettings/Settings/VideoSettings.js +2 -3
  83. package/dist/Editor/common/RnD/ElementSettings/styles.js +1 -0
  84. package/dist/Editor/common/RnD/OptionsPopup/style.js +1 -0
  85. package/dist/Editor/common/RnD/SwitchViewport/SwitchViewport.js +2 -11
  86. package/dist/Editor/common/RnD/Theme/ViewportStimulator.js +3 -6
  87. package/dist/Editor/common/RnD/Utils/gridDropItem.js +19 -28
  88. package/dist/Editor/common/RnD/Utils/index.js +1 -3
  89. package/dist/Editor/common/RnD/VirtualElement/VirtualTextElement.js +58 -42
  90. package/dist/Editor/common/RnD/VirtualElement/helper.js +132 -323
  91. package/dist/Editor/common/RnD/VirtualElement/styles.js +0 -16
  92. package/dist/Editor/common/RnD/index.js +39 -68
  93. package/dist/Editor/common/Select/index.js +7 -44
  94. package/dist/Editor/common/Select/styles.js +2 -31
  95. package/dist/Editor/common/Shorthands/elements.js +0 -54
  96. package/dist/Editor/common/StyleBuilder/accordionTitleBtnStyle.js +2 -2
  97. package/dist/Editor/common/StyleBuilder/accordionTitleStyle.js +9 -12
  98. package/dist/Editor/common/StyleBuilder/buttonStyle.js +2 -4
  99. package/dist/Editor/common/StyleBuilder/embedVideoStyle.js +0 -4
  100. package/dist/Editor/common/StyleBuilder/fieldTypes/backgroundImage.js +0 -5
  101. package/dist/Editor/common/StyleBuilder/fieldTypes/bannerSpacing.js +2 -12
  102. package/dist/Editor/common/StyleBuilder/fieldTypes/borderRadius.js +7 -15
  103. package/dist/Editor/common/StyleBuilder/fieldTypes/card.js +8 -16
  104. package/dist/Editor/common/StyleBuilder/fieldTypes/color.js +10 -36
  105. package/dist/Editor/common/StyleBuilder/fieldTypes/fontSize.js +7 -16
  106. package/dist/Editor/common/StyleBuilder/fieldTypes/index.js +1 -3
  107. package/dist/Editor/common/StyleBuilder/fieldTypes/textOptions.js +7 -15
  108. package/dist/Editor/common/SwipeableDrawer/style.js +12 -14
  109. package/dist/Editor/common/Uploader.js +0 -16
  110. package/dist/Editor/common/iconListV2.js +0 -76
  111. package/dist/Editor/common/iconslist.js +0 -21
  112. package/dist/Editor/commonStyle.js +61 -116
  113. package/dist/Editor/helper/index.js +1 -5
  114. package/dist/Editor/helper/theme.js +2 -203
  115. package/dist/Editor/hooks/useMouseMove.js +3 -9
  116. package/dist/Editor/hooks/useTable.js +4 -5
  117. package/dist/Editor/plugins/withEmbeds.js +1 -1
  118. package/dist/Editor/plugins/withHTML.js +1 -3
  119. package/dist/Editor/plugins/withTable.js +1 -1
  120. package/dist/Editor/theme/ThemeList.js +173 -50
  121. package/dist/Editor/utils/SlateUtilityFunctions.js +37 -161
  122. package/dist/Editor/utils/accordion.js +4 -14
  123. package/dist/Editor/utils/button.js +17 -1
  124. package/dist/Editor/utils/customHooks/useTableResize.js +9 -49
  125. package/dist/Editor/utils/draftToSlate.js +2 -3
  126. package/dist/Editor/utils/events.js +6 -50
  127. package/dist/Editor/utils/font.js +37 -40
  128. package/dist/Editor/utils/formfield.js +0 -1
  129. package/dist/Editor/utils/helper.js +26 -210
  130. package/dist/Editor/utils/insertAppHeader.js +1 -1
  131. package/dist/Editor/utils/signature.js +9 -2
  132. package/package.json +4 -4
  133. package/dist/Editor/Elements/FreeGrid/helper.js +0 -115
  134. package/dist/Editor/Toolbar/PopupTool/ThemeTextFormat.js +0 -439
  135. package/dist/Editor/assets/svg/BackIcon.js +0 -18
  136. package/dist/Editor/assets/svg/ThemeIcons.js +0 -293
  137. package/dist/Editor/common/Checkbox/index.js +0 -46
  138. package/dist/Editor/common/Checkbox/styles.js +0 -45
  139. package/dist/Editor/common/CustomColorPicker/index.js +0 -130
  140. package/dist/Editor/common/CustomColorPicker/style.js +0 -53
  141. package/dist/Editor/common/CustomDialog2/index.js +0 -94
  142. package/dist/Editor/common/CustomDialog2/style.js +0 -67
  143. package/dist/Editor/common/CustomSelect.js +0 -43
  144. package/dist/Editor/common/RadioGroup/index.js +0 -48
  145. package/dist/Editor/common/RadioGroup/styles.js +0 -29
  146. package/dist/Editor/common/RnD/Theme/MainThemeProvider.js +0 -17
  147. package/dist/Editor/common/StyleBuilder/fieldTypes/embedUpload.js +0 -115
  148. package/dist/Editor/helper/textIndeces.js +0 -58
  149. package/dist/Editor/hooks/useEditorTheme.js +0 -153
  150. package/dist/Editor/hooks/useThemeValues.js +0 -63
  151. package/dist/Editor/theme/index.js +0 -149
  152. package/dist/Editor/themeSettings/ActiveTheme.js +0 -82
  153. package/dist/Editor/themeSettings/buttons/index.js +0 -300
  154. package/dist/Editor/themeSettings/buttons/style.js +0 -23
  155. package/dist/Editor/themeSettings/colorTheme/index.js +0 -310
  156. package/dist/Editor/themeSettings/colorTheme/style.js +0 -81
  157. package/dist/Editor/themeSettings/fonts/PreviewElement.js +0 -121
  158. package/dist/Editor/themeSettings/fonts/index.js +0 -240
  159. package/dist/Editor/themeSettings/fonts/style.js +0 -62
  160. package/dist/Editor/themeSettings/icons.js +0 -60
  161. package/dist/Editor/themeSettings/index.js +0 -380
  162. package/dist/Editor/themeSettings/style.js +0 -299
  163. package/dist/Editor/themeSettingsAI/icons.js +0 -96
  164. package/dist/Editor/themeSettingsAI/index.js +0 -355
  165. package/dist/Editor/themeSettingsAI/saveTheme.js +0 -202
  166. package/dist/Editor/themeSettingsAI/style.js +0 -332
  167. 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: "#0F172A",
173
+ color: '#0F172A',
175
174
  "& .MuiChip-deleteIcon": {
176
175
  flexShrink: 0,
177
176
  "& path": {
178
- stroke: "#0F172A !important"
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: "12px",
226
- pl: "12px",
227
- marginTop: "12px",
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
- "& rect": {
284
+ '& rect': {
286
285
  fill: theme?.palette?.editor?.closeButtonSvgStroke
287
286
  },
288
- "&:hover": {
289
- backgroundColor: "transparent"
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: "Inter",
299
+ fontFamily: 'Inter',
301
300
  fontWeight: 400,
302
- fontSize: "12px"
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: "#0F172A",
317
+ color: '#0F172A',
319
318
  "& .MuiChip-deleteIcon": {
320
319
  flexShrink: 0,
321
320
  "& path": {
322
- stroke: "#0F172A !important"
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: "12px",
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: "4px"
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: "8px",
348
+ pl: '8px',
350
349
  color: theme?.palette?.editor?.secondaryTextColor,
351
- fontFamily: "Inter",
350
+ fontFamily: 'Inter',
352
351
  fontWeight: 400,
353
- fontSize: "12px"
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: "space-between",
367
- "&:hover": {
368
- "& path": {
365
+ justifyContent: 'space-between',
366
+ '&:hover': {
367
+ '& path': {
369
368
  stroke: theme?.palette?.editor?.activeColor
370
369
  },
371
- borderRadius: "12px"
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: "#0F172A",
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
- "& path": {
391
+ '& path': {
393
392
  stroke: theme?.palette?.editor?.closeButtonSvgStroke
394
393
  },
395
- "&:hover": {
396
- backgroundColor: "transparent"
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: "#0F172A",
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;
@@ -60,6 +60,7 @@ const AddOptions = props => {
60
60
  };
61
61
  const onBlur = () => {
62
62
  setValue("");
63
+ setAddBox(false);
63
64
  setError("");
64
65
  };
65
66
  return edit?.type === "select" || edit?.type === "multi-select" ? /*#__PURE__*/_jsxs(Box, {
@@ -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
- }), translation(TYPE_LABELS[type] || "Embed Video or Other")]
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) => {
@@ -35,6 +35,7 @@ const FormTextArea = props => {
35
35
  onChange: onChange,
36
36
  sx: {
37
37
  width: "100%",
38
+ borderWidth: "1px",
38
39
  borderBlockStyle: "solid",
39
40
  padding: {
40
41
  ...getTRBLBreakPoints(bannerSpacing)
@@ -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
- } = getNode(editor, formPath) || {};
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
- "& .mini-editor-cls": {
13
- padding: "12px",
14
- "&:focus-visible": {
15
- outline: "none",
16
- border: "none"
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: "130px",
21
- padding: "12px",
20
+ minHeight: '130px',
21
+ padding: '12px',
22
22
  paddingBottom: 0,
23
- "&:focus-visible": {
24
- outline: "none",
25
- border: "none"
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: "126px",
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
- // "&:before": {
175
- // content: '" "',
176
- // position: "absolute",
177
- // top: "-5px",
178
- // left: "-5px",
179
- // width: "calc(100% + 4px)",
180
- // height: "calc(100% + 4px)",
181
- // border: "3px solid blue",
182
- // borderRadius: "50%",
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: "10px"
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(updatedFormNameNode))
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
- // width_xs: 217,
262
- // height_xs: 173,
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 (xsVal) {
403
+ if (breakpoint === "lg") {
410
404
  setSelectedElement({});
405
+
406
+ // auto align in mobile
411
407
  Transforms.setNodes(editor, {
412
- height_xs: sectionHeightXs,
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, groupByBreakpoint } from "../../helper/theme";
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
- ...boxSp,
229
+ borderRadius: {
230
+ ...getBreakPointsValue(sectionBorderRadius || {}, null, "overrideBorderRadius", true)
231
+ },
235
232
  background: sectionBgColor,
236
233
  backgroundImage: sectionBackgroundImage ? `url('${sectionBackgroundImage}')` : "",
237
234
  borderColor: borderColor || "transparent",
@@ -320,7 +320,6 @@ const FreeGridItem = props => {
320
320
  breakpoint: breakpoint,
321
321
  customProps: customProps,
322
322
  translation: translation,
323
- xsHidden: xsHidden,
324
323
  children: /*#__PURE__*/_jsxs(Box, {
325
324
  component: "div",
326
325
  ...attributes,
@@ -5,8 +5,8 @@ import { jsxs as _jsxs } from "react/jsx-runtime";
5
5
  const More = props => {
6
6
  const {
7
7
  handleClick,
8
- translation,
9
- breakpoint
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, /*#__PURE__*/_jsx(ListItemButton, {
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", "link", "saveAsTemplate", "close"];
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"];