@flozy/editor 10.3.0 → 10.3.1

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 (162) hide show
  1. package/dist/Editor/ChatEditor.js +16 -17
  2. package/dist/Editor/CommonEditor.js +14 -128
  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 +7 -30
  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 -1
  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 +30 -31
  26. package/dist/Editor/Elements/FreeGrid/FreeGridBox.js +4 -7
  27. package/dist/Editor/Elements/FreeGrid/Options/More.js +7 -7
  28. package/dist/Editor/Elements/FreeGrid/styles.js +0 -14
  29. package/dist/Editor/Elements/Grid/Grid.js +2 -14
  30. package/dist/Editor/Elements/Grid/GridItem.js +1 -1
  31. package/dist/Editor/Elements/Signature/Signature.css +1 -2
  32. package/dist/Editor/Elements/Signature/SignatureOptions/DrawSignature.js +5 -18
  33. package/dist/Editor/Elements/Signature/SignatureOptions/UploadSignature.js +3 -16
  34. package/dist/Editor/Elements/SimpleText/style.js +2 -2
  35. package/dist/Editor/Elements/Table/DragButton.js +1 -0
  36. package/dist/Editor/Elements/Table/Draggable.js +2 -6
  37. package/dist/Editor/Elements/Table/Styles.js +0 -7
  38. package/dist/Editor/Elements/Table/Table.js +3 -3
  39. package/dist/Editor/Elements/Table/TableCell.js +5 -24
  40. package/dist/Editor/Elements/Title/title.js +6 -6
  41. package/dist/Editor/Elements/Variables/VariableButton.js +1 -10
  42. package/dist/Editor/MiniEditor.js +1 -2
  43. package/dist/Editor/Styles/EditorStyles.js +5 -5
  44. package/dist/Editor/Toolbar/FormatTools/Dropdown.js +3 -27
  45. package/dist/Editor/Toolbar/FormatTools/FontFamilyAutocomplete.js +3 -4
  46. package/dist/Editor/Toolbar/FormatTools/MarkButton.js +2 -2
  47. package/dist/Editor/Toolbar/FormatTools/TextSize.js +13 -10
  48. package/dist/Editor/Toolbar/Mini/MiniToolbar.js +1 -2
  49. package/dist/Editor/Toolbar/PopupTool/MiniTextFormat/MiniColorPicker.js +2 -4
  50. package/dist/Editor/Toolbar/PopupTool/MiniTextFormat/SelectFontSize.js +13 -6
  51. package/dist/Editor/Toolbar/PopupTool/MiniTextFormat/SelectTypography.js +42 -167
  52. package/dist/Editor/Toolbar/PopupTool/MiniTextFormat/index.js +4 -7
  53. package/dist/Editor/Toolbar/PopupTool/PopperHeader.js +1 -2
  54. package/dist/Editor/Toolbar/PopupTool/PopupToolStyle.js +12 -72
  55. package/dist/Editor/Toolbar/PopupTool/TextFormat.js +10 -58
  56. package/dist/Editor/Toolbar/PopupTool/index.js +1 -1
  57. package/dist/Editor/Toolbar/toolbarGroups.js +6 -48
  58. package/dist/Editor/common/ColorPickerButton.js +16 -41
  59. package/dist/Editor/common/DnD/DragHandleButton.js +1 -1
  60. package/dist/Editor/common/FontLoader/FontLoader.js +0 -3
  61. package/dist/Editor/common/Icon.js +0 -28
  62. package/dist/Editor/common/ImageSelector/ImageSelector.js +2 -2
  63. package/dist/Editor/common/ImageSelector/Styles.js +9 -3
  64. package/dist/Editor/common/LinkSettings/NavComponents.js +65 -45
  65. package/dist/Editor/common/LinkSettings/index.js +26 -13
  66. package/dist/Editor/common/LinkSettings/navOptions.js +2 -2
  67. package/dist/Editor/common/LinkSettings/style.js +244 -164
  68. package/dist/Editor/common/RnD/ElementOptions/Actions.js +5 -4
  69. package/dist/Editor/common/RnD/ElementSettings/OtherSettings/Settings.js +1 -2
  70. package/dist/Editor/common/RnD/ElementSettings/OtherSettings/Signature.js +3 -4
  71. package/dist/Editor/common/RnD/ElementSettings/Settings/AppHeaderSettings.js +2 -3
  72. package/dist/Editor/common/RnD/ElementSettings/Settings/BoxSettings.js +2 -3
  73. package/dist/Editor/common/RnD/ElementSettings/Settings/ButtonSettings.js +2 -3
  74. package/dist/Editor/common/RnD/ElementSettings/Settings/CodeSettings.js +2 -3
  75. package/dist/Editor/common/RnD/ElementSettings/Settings/FormSettings.js +2 -4
  76. package/dist/Editor/common/RnD/ElementSettings/Settings/ImageSettings.js +2 -3
  77. package/dist/Editor/common/RnD/ElementSettings/Settings/TableSettings.js +2 -3
  78. package/dist/Editor/common/RnD/ElementSettings/Settings/TextSettings.js +1 -3
  79. package/dist/Editor/common/RnD/ElementSettings/Settings/VideoSettings.js +2 -3
  80. package/dist/Editor/common/RnD/ElementSettings/styles.js +1 -0
  81. package/dist/Editor/common/RnD/OptionsPopup/style.js +1 -0
  82. package/dist/Editor/common/RnD/SwitchViewport/SwitchViewport.js +2 -11
  83. package/dist/Editor/common/RnD/Theme/ViewportStimulator.js +3 -6
  84. package/dist/Editor/common/RnD/Utils/gridDropItem.js +19 -28
  85. package/dist/Editor/common/RnD/Utils/index.js +1 -3
  86. package/dist/Editor/common/RnD/VirtualElement/VirtualTextElement.js +58 -42
  87. package/dist/Editor/common/RnD/VirtualElement/helper.js +131 -321
  88. package/dist/Editor/common/RnD/VirtualElement/styles.js +0 -16
  89. package/dist/Editor/common/RnD/index.js +11 -25
  90. package/dist/Editor/common/Select/index.js +7 -44
  91. package/dist/Editor/common/Select/styles.js +2 -30
  92. package/dist/Editor/common/Shorthands/elements.js +0 -54
  93. package/dist/Editor/common/StyleBuilder/accordionTitleBtnStyle.js +2 -2
  94. package/dist/Editor/common/StyleBuilder/accordionTitleStyle.js +9 -12
  95. package/dist/Editor/common/StyleBuilder/buttonStyle.js +2 -4
  96. package/dist/Editor/common/StyleBuilder/embedVideoStyle.js +0 -4
  97. package/dist/Editor/common/StyleBuilder/fieldTypes/backgroundImage.js +0 -5
  98. package/dist/Editor/common/StyleBuilder/fieldTypes/bannerSpacing.js +2 -12
  99. package/dist/Editor/common/StyleBuilder/fieldTypes/borderRadius.js +7 -15
  100. package/dist/Editor/common/StyleBuilder/fieldTypes/card.js +8 -16
  101. package/dist/Editor/common/StyleBuilder/fieldTypes/color.js +10 -36
  102. package/dist/Editor/common/StyleBuilder/fieldTypes/fontSize.js +7 -16
  103. package/dist/Editor/common/StyleBuilder/fieldTypes/index.js +1 -3
  104. package/dist/Editor/common/StyleBuilder/fieldTypes/textOptions.js +7 -15
  105. package/dist/Editor/common/SwipeableDrawer/style.js +12 -14
  106. package/dist/Editor/common/Uploader.js +0 -16
  107. package/dist/Editor/common/iconListV2.js +0 -76
  108. package/dist/Editor/common/iconslist.js +0 -21
  109. package/dist/Editor/commonStyle.js +61 -116
  110. package/dist/Editor/helper/index.js +0 -4
  111. package/dist/Editor/helper/theme.js +2 -203
  112. package/dist/Editor/hooks/useMouseMove.js +3 -9
  113. package/dist/Editor/hooks/useTable.js +4 -5
  114. package/dist/Editor/plugins/withEmbeds.js +1 -1
  115. package/dist/Editor/plugins/withHTML.js +1 -3
  116. package/dist/Editor/plugins/withTable.js +1 -1
  117. package/dist/Editor/theme/ThemeList.js +173 -50
  118. package/dist/Editor/utils/SlateUtilityFunctions.js +36 -158
  119. package/dist/Editor/utils/accordion.js +4 -14
  120. package/dist/Editor/utils/button.js +17 -1
  121. package/dist/Editor/utils/customHooks/useTableResize.js +9 -49
  122. package/dist/Editor/utils/draftToSlate.js +2 -3
  123. package/dist/Editor/utils/events.js +6 -50
  124. package/dist/Editor/utils/font.js +37 -40
  125. package/dist/Editor/utils/helper.js +30 -143
  126. package/dist/Editor/utils/insertAppHeader.js +1 -1
  127. package/dist/Editor/utils/signature.js +9 -2
  128. package/package.json +4 -4
  129. package/dist/Editor/Elements/FreeGrid/helper.js +0 -113
  130. package/dist/Editor/Toolbar/PopupTool/ThemeTextFormat.js +0 -439
  131. package/dist/Editor/assets/svg/BackIcon.js +0 -18
  132. package/dist/Editor/assets/svg/ThemeIcons.js +0 -293
  133. package/dist/Editor/common/Checkbox/index.js +0 -46
  134. package/dist/Editor/common/Checkbox/styles.js +0 -45
  135. package/dist/Editor/common/CustomColorPicker/index.js +0 -130
  136. package/dist/Editor/common/CustomColorPicker/style.js +0 -53
  137. package/dist/Editor/common/CustomDialog2/index.js +0 -94
  138. package/dist/Editor/common/CustomDialog2/style.js +0 -67
  139. package/dist/Editor/common/CustomSelect.js +0 -43
  140. package/dist/Editor/common/RadioGroup/index.js +0 -48
  141. package/dist/Editor/common/RadioGroup/styles.js +0 -29
  142. package/dist/Editor/common/RnD/Theme/MainThemeProvider.js +0 -17
  143. package/dist/Editor/common/StyleBuilder/fieldTypes/embedUpload.js +0 -115
  144. package/dist/Editor/helper/textIndeces.js +0 -58
  145. package/dist/Editor/hooks/useEditorTheme.js +0 -153
  146. package/dist/Editor/hooks/useThemeValues.js +0 -63
  147. package/dist/Editor/theme/index.js +0 -149
  148. package/dist/Editor/themeSettings/ActiveTheme.js +0 -82
  149. package/dist/Editor/themeSettings/buttons/index.js +0 -300
  150. package/dist/Editor/themeSettings/buttons/style.js +0 -23
  151. package/dist/Editor/themeSettings/colorTheme/index.js +0 -310
  152. package/dist/Editor/themeSettings/colorTheme/style.js +0 -81
  153. package/dist/Editor/themeSettings/fonts/PreviewElement.js +0 -121
  154. package/dist/Editor/themeSettings/fonts/index.js +0 -240
  155. package/dist/Editor/themeSettings/fonts/style.js +0 -62
  156. package/dist/Editor/themeSettings/icons.js +0 -60
  157. package/dist/Editor/themeSettings/index.js +0 -380
  158. package/dist/Editor/themeSettings/style.js +0 -299
  159. package/dist/Editor/themeSettingsAI/icons.js +0 -96
  160. package/dist/Editor/themeSettingsAI/index.js +0 -355
  161. package/dist/Editor/themeSettingsAI/saveTheme.js +0 -202
  162. package/dist/Editor/themeSettingsAI/style.js +0 -332
@@ -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";
@@ -206,7 +207,7 @@ const Form = props => {
206
207
  }, {
207
208
  at: path
208
209
  });
209
- // adding form field style to the current form node
210
+ // adding form field style to the current form node
210
211
  const currentNode = Node.get(editor, path);
211
212
  if (currentNode) {
212
213
  currentNode.children.forEach((item, index) => {
@@ -414,6 +415,7 @@ const Form = props => {
414
415
  lineHeight: 1.43,
415
416
  ...formSX
416
417
  },
418
+ ref: formEle,
417
419
  children: [/*#__PURE__*/_jsx(Grid, {
418
420
  className: "form-grid",
419
421
  item: true,
@@ -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,7 +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
25
  import { jsx as _jsx } from "react/jsx-runtime";
27
26
  import { jsxs as _jsxs } from "react/jsx-runtime";
28
27
  const MAX_DEVICE_WIDTH = {
@@ -181,10 +180,6 @@ const FreeGrid = props => {
181
180
  const handleAddElementClick = type => () => {
182
181
  const isEmpty = isEmptySection();
183
182
  const insertAt = isEmpty ? [...path, 0] : [...path, childrenCountRef.current];
184
- const {
185
- xsVal,
186
- sectionHeightXs
187
- } = getNewElementXsValues(type, element?.children);
188
183
  switch (type) {
189
184
  case "addText":
190
185
  Transforms.insertNodes(editor, [{
@@ -201,8 +196,7 @@ const FreeGrid = props => {
201
196
  marginTop: 0,
202
197
  top: 0,
203
198
  width: 170,
204
- height: 30,
205
- ...(xsVal || {})
199
+ height: 30
206
200
  }], {
207
201
  at: [...insertAt]
208
202
  });
@@ -220,6 +214,20 @@ const FreeGrid = props => {
220
214
  linkType: "webAddress"
221
215
  },
222
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
+ },
223
231
  textAlign: "center",
224
232
  label: "Get Started"
225
233
  }],
@@ -228,8 +236,7 @@ const FreeGrid = props => {
228
236
  marginTop: 0,
229
237
  top: 0,
230
238
  width: 143,
231
- height: 50,
232
- ...(xsVal || {})
239
+ height: 50
233
240
  }], {
234
241
  at: [...insertAt]
235
242
  });
@@ -255,9 +262,8 @@ const FreeGrid = props => {
255
262
  top: 0,
256
263
  width: 217,
257
264
  height: 173,
258
- // width_xs: 217,
259
- // height_xs: 173,
260
- ...(xsVal || {})
265
+ width_xs: 217,
266
+ height_xs: 173
261
267
  }], {
262
268
  at: [...insertAt]
263
269
  });
@@ -280,8 +286,7 @@ const FreeGrid = props => {
280
286
  marginTop: 0,
281
287
  top: 0,
282
288
  width: 170,
283
- height: 80,
284
- ...(xsVal || {})
289
+ height: 80
285
290
  }], {
286
291
  at: [...insertAt]
287
292
  });
@@ -294,8 +299,7 @@ const FreeGrid = props => {
294
299
  images: []
295
300
  }), {
296
301
  height: 370,
297
- width: 650,
298
- ...(xsVal || {})
302
+ width: 650
299
303
  })
300
304
  }], {
301
305
  at: [...insertAt]
@@ -307,8 +311,7 @@ const FreeGrid = props => {
307
311
  ...DEFAULT_TABLE_NODE()
308
312
  }, {
309
313
  height: 150,
310
- width: 400,
311
- ...(xsVal || {})
314
+ width: 400
312
315
  })
313
316
  }], {
314
317
  at: [...insertAt]
@@ -332,8 +335,7 @@ const FreeGrid = props => {
332
335
  marginTop: 0,
333
336
  top: 0,
334
337
  width: 400,
335
- height: 300,
336
- ...(xsVal || {})
338
+ height: 300
337
339
  }], {
338
340
  at: [...insertAt]
339
341
  });
@@ -345,9 +347,7 @@ const FreeGrid = props => {
345
347
  children: [{
346
348
  text: ""
347
349
  }]
348
- }, {
349
- ...(xsVal || {})
350
- }, "freegridBox")
350
+ }, {}, "freegridBox")
351
351
  }], {
352
352
  at: [...insertAt]
353
353
  });
@@ -358,8 +358,7 @@ const FreeGrid = props => {
358
358
  ...FORM_NODE()
359
359
  }, {
360
360
  height: 92,
361
- width: 400,
362
- ...(xsVal || {})
361
+ width: 400
363
362
  })
364
363
  }], {
365
364
  at: [...insertAt]
@@ -373,8 +372,7 @@ const FreeGrid = props => {
373
372
  })
374
373
  }, {
375
374
  height: 60,
376
- width: 400,
377
- ...(xsVal || {})
375
+ width: 400
378
376
  })
379
377
  }], {
380
378
  at: [...insertAt]
@@ -395,18 +393,19 @@ const FreeGrid = props => {
395
393
  marginTop: 0,
396
394
  top: 0,
397
395
  width: 170,
398
- height: 30,
399
- ...(xsVal || {})
396
+ height: 30
400
397
  }], {
401
398
  at: [...insertAt]
402
399
  });
403
400
  break;
404
401
  default:
405
402
  }
406
- if (xsVal) {
403
+ if (breakpoint === "lg") {
407
404
  setSelectedElement({});
405
+
406
+ // auto align in mobile
408
407
  Transforms.setNodes(editor, {
409
- height_xs: sectionHeightXs,
408
+ xs_updatedOn: null,
410
409
  updated_at: new Date().getTime()
411
410
  }, {
412
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",
@@ -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
  };
@@ -247,9 +247,6 @@ const useFreeGridStyles = ({
247
247
  },
248
248
  "& > .simple-text": {
249
249
  display: "none"
250
- },
251
- "& > .edt-paragraphs": {
252
- display: "none"
253
250
  }
254
251
  },
255
252
  "& .fgi_type_form": {
@@ -353,17 +350,6 @@ const useFreeGridStyles = ({
353
350
  "& .fgi_type_text": {
354
351
  "& .edt-headings": {
355
352
  margin: "0px"
356
- },
357
- "& .edt-paragraphs": {
358
- margin: "0px"
359
- }
360
- },
361
- "& .fgi_type_table": {
362
- "& .edt-headings": {
363
- margin: "0px"
364
- },
365
- "& .edt-paragraphs": {
366
- margin: "0px"
367
353
  }
368
354
  },
369
355
  /** element toolbar hide */
@@ -1,6 +1,6 @@
1
1
  /* eslint-disable no-unused-vars */
2
2
  import React, { useState } from "react";
3
- import { Transforms, Path, Node, Editor, Element } from "slate";
3
+ import { Transforms, Path, Node } from "slate";
4
4
  import { useSlateStatic, ReactEditor } from "slate-react";
5
5
  import { IconButton, Tooltip, Grid as GridContainer, useTheme } from "@mui/material";
6
6
  import ArrowUpwardIcon from "@mui/icons-material/ArrowUpward";
@@ -206,19 +206,7 @@ const Grid = props => {
206
206
  };
207
207
  const onAddSection = () => () => {
208
208
  try {
209
- let duplicateGrid = JSON.parse(JSON.stringify(element));
210
- const carousel = Editor.above(editor, {
211
- at: path,
212
- match: n => !Editor.isEditor(n) && Element.isElement(n) && n.type === "carousel-item"
213
- });
214
- if (carousel) {
215
- const [carouselNode, carouselItemPath] = carousel || [];
216
- const duplicatecCarousel = JSON.parse(JSON.stringify(carouselNode));
217
- Transforms.insertNodes(editor, duplicatecCarousel, {
218
- at: Path.next(carouselItemPath)
219
- });
220
- return;
221
- }
209
+ const duplicateGrid = JSON.parse(JSON.stringify(element));
222
210
  insertGrid(editor, duplicateGrid, [path[0] + 1, 0]);
223
211
  } catch (err) {
224
212
  console.log(err);
@@ -292,7 +292,7 @@ const GridItem = props => {
292
292
  ...getBRProps,
293
293
  display: "flex",
294
294
  flexDirection: flexDirection || "column",
295
- background: bgColor,
295
+ background: bgColor || "transparent",
296
296
  borderColor: getBorderColor(),
297
297
  borderWidth: borderWidth || "1px",
298
298
  borderStyle: borderStyle || "solid",
@@ -46,12 +46,11 @@
46
46
 
47
47
  .upload-input-wrapper {
48
48
  width: 100%;
49
- height: 100%;
50
49
  position: relative;
51
50
  }
52
51
  .upload-input-wrapper input {
53
52
  width: 100%;
54
- height: 100%;
53
+ height: 100px;
55
54
  opacity: 0;
56
55
  z-index: 1;
57
56
  position: relative;
@@ -1,7 +1,6 @@
1
1
  import React, { useRef, useState } from "react";
2
2
  import SignatureCanvas from "react-signature-canvas";
3
- import { Grid, IconButton, useMediaQuery } from "@mui/material";
4
- import { ResetIcon } from "../../../common/iconListV2";
3
+ import { Grid, useMediaQuery } from "@mui/material";
5
4
  import { jsx as _jsx } from "react/jsx-runtime";
6
5
  import { jsxs as _jsxs } from "react/jsx-runtime";
7
6
  const DrawSignature = props => {
@@ -25,13 +24,6 @@ const DrawSignature = props => {
25
24
  signature: result?.imageURL || strImage
26
25
  });
27
26
  };
28
- const onClear = () => {
29
- canvasRef.clear();
30
- setUploading(false);
31
- onDataChange({
32
- signature: ""
33
- });
34
- };
35
27
  const isMobile = useMediaQuery("(max-width:599px)");
36
28
  const signatureCanvasStyle = isMobile ? {
37
29
  width: "260px",
@@ -39,15 +31,14 @@ const DrawSignature = props => {
39
31
  } : {};
40
32
  return /*#__PURE__*/_jsxs(Grid, {
41
33
  container: true,
42
- children: [uploading ? "Uploading..." : "", /*#__PURE__*/_jsxs(Grid, {
34
+ children: [uploading ? "Uploading..." : "", /*#__PURE__*/_jsx(Grid, {
43
35
  item: true,
44
36
  xs: 12,
45
37
  style: {
46
38
  width: "100%",
47
- height: "209px",
48
- position: "relative"
39
+ height: "209px"
49
40
  },
50
- children: [/*#__PURE__*/_jsx(SignatureCanvas, {
41
+ children: /*#__PURE__*/_jsx(SignatureCanvas, {
51
42
  canvasProps: {
52
43
  className: "signature-canvas",
53
44
  ...signatureCanvasStyle
@@ -56,11 +47,7 @@ const DrawSignature = props => {
56
47
  ref: ref => canvasRef = ref,
57
48
  maxWidth: brush.size || 2,
58
49
  penColor: brush?.color || "#000"
59
- }), /*#__PURE__*/_jsx(IconButton, {
60
- className: "clear-canvas",
61
- onClick: onClear,
62
- children: /*#__PURE__*/_jsx(ResetIcon, {})
63
- })]
50
+ })
64
51
  })]
65
52
  });
66
53
  };
@@ -30,28 +30,15 @@ const UploadSignature = props => {
30
30
  signature: result?.imageURL || strImage
31
31
  });
32
32
  };
33
- const onRemove = () => {
34
- setBase64(null);
35
- setUploading(false);
36
- onUploadDone({
37
- signature: ""
38
- });
39
- };
40
33
  return /*#__PURE__*/_jsxs("div", {
41
34
  className: "signature-tab2",
42
- children: [uploading ? "Uploading..." : "", base64 ? /*#__PURE__*/_jsxs("div", {
35
+ children: [uploading ? "Uploading..." : "", base64 ? /*#__PURE__*/_jsx("div", {
43
36
  className: "upload-sign-img-wrapper",
44
- children: [/*#__PURE__*/_jsx("img", {
37
+ children: /*#__PURE__*/_jsx("img", {
45
38
  className: "upload-sign-img",
46
39
  src: base64,
47
40
  alt: "Signature"
48
- }), /*#__PURE__*/_jsx(Typography, {
49
- variant: "body2",
50
- gutterBottom: true,
51
- className: "remove-sign-img-btn",
52
- onClick: onRemove,
53
- children: "Remove"
54
- })]
41
+ })
55
42
  }) : /*#__PURE__*/_jsxs("div", {
56
43
  className: "upload-input-wrapper",
57
44
  children: [/*#__PURE__*/_jsx("input", {
@@ -35,8 +35,8 @@ const SimpleTextStyle = ({
35
35
  height: "24px",
36
36
  overflow: "hidden",
37
37
  fontSize: "14px",
38
- display: "inline-flex",
39
- alignItems: "center",
38
+ display: 'inline-flex',
39
+ alignItems: 'center',
40
40
  "& .bg-pad-sl": {
41
41
  padding: "2px 4px 2px 4px",
42
42
  background: "transparent",
@@ -44,6 +44,7 @@ function DragButton({
44
44
  const dragProps = {
45
45
  ...dndProps,
46
46
  id: dndProps?.id + dragType,
47
+ disabled: isMobile,
47
48
  data: {
48
49
  ...dndProps.data,
49
50
  dragType
@@ -13,13 +13,9 @@ function Draggable(props) {
13
13
  } = props?.data || {};
14
14
  const style = transform ? {
15
15
  transform: dragType === "row" ? `translate3d(0, ${transform.y}px, 0)` : `translate3d(${transform.x}px, 0, 0)`
16
- } : {};
16
+ } : undefined;
17
17
  return /*#__PURE__*/_jsx(Box, {
18
- style: {
19
- ...style,
20
- touchAction: "none" // Disables scrolling while dragging. Necessary for proper mobile drag functionality.
21
- },
22
-
18
+ style: style,
23
19
  ref: setNodeRef,
24
20
  ...listeners,
25
21
  ...attributes,