@flozy/editor 10.2.5 → 10.2.7

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 (187) hide show
  1. package/dist/Editor/ChatEditor.js +17 -16
  2. package/dist/Editor/CommonEditor.js +131 -16
  3. package/dist/Editor/DialogWrapper.js +31 -25
  4. package/dist/Editor/Editor.css +46 -8
  5. package/dist/Editor/Elements/AI/PopoverAIInput.js +11 -3
  6. package/dist/Editor/Elements/Accordion/Accordion.js +30 -7
  7. package/dist/Editor/Elements/Accordion/AccordionSummary.js +1 -23
  8. package/dist/Editor/Elements/AppHeader/AppHeader.js +10 -5
  9. package/dist/Editor/Elements/Button/EditorButton.js +27 -9
  10. package/dist/Editor/Elements/Carousel/CarouselItem.js +2 -1
  11. package/dist/Editor/Elements/Color Picker/ColorButtons.js +61 -14
  12. package/dist/Editor/Elements/Color Picker/ColorPicker.css +25 -1
  13. package/dist/Editor/Elements/Color Picker/ColorPicker.js +10 -7
  14. package/dist/Editor/Elements/Color Picker/Styles.js +15 -13
  15. package/dist/Editor/Elements/DataView/Layouts/ColumnView.js +4 -2
  16. package/dist/Editor/Elements/DataView/Layouts/DataTypes/Components/MultiSelect.js +454 -0
  17. package/dist/Editor/Elements/DataView/Layouts/DataTypes/MultiSelectType.js +23 -8
  18. package/dist/Editor/Elements/DataView/Layouts/Options/AddOptions.js +5 -2
  19. package/dist/Editor/Elements/DataView/Layouts/Options/EditOption.js +3 -2
  20. package/dist/Editor/Elements/DataView/Layouts/Options/index.js +11 -0
  21. package/dist/Editor/Elements/DataView/Layouts/ViewData.js +8 -4
  22. package/dist/Editor/Elements/Embed/Image.js +3 -2
  23. package/dist/Editor/Elements/Embed/Video.js +1 -1
  24. package/dist/Editor/Elements/EmbedScript/Code.js +14 -2
  25. package/dist/Editor/Elements/EmbedScript/EmbedScriptPopup.js +57 -28
  26. package/dist/Editor/Elements/EmbedScript/styles.js +89 -0
  27. package/dist/Editor/Elements/Form/Form.js +181 -170
  28. package/dist/Editor/Elements/Form/FormElements/FormText.js +23 -6
  29. package/dist/Editor/Elements/Form/FormElements/FormTextArea.js +2 -2
  30. package/dist/Editor/Elements/Form/FormField.js +13 -6
  31. package/dist/Editor/Elements/Form/Workflow/Styles.js +24 -22
  32. package/dist/Editor/Elements/FreeGrid/FreeGrid.js +36 -31
  33. package/dist/Editor/Elements/FreeGrid/FreeGridBox.js +7 -4
  34. package/dist/Editor/Elements/FreeGrid/Options/More.js +8 -8
  35. package/dist/Editor/Elements/FreeGrid/helper.js +113 -0
  36. package/dist/Editor/Elements/FreeGrid/styles.js +75 -7
  37. package/dist/Editor/Elements/Grid/Grid.js +14 -2
  38. package/dist/Editor/Elements/Grid/GridItem.js +1 -1
  39. package/dist/Editor/Elements/List/CheckList.js +3 -2
  40. package/dist/Editor/Elements/Search/SearchAttachment.js +40 -9
  41. package/dist/Editor/Elements/Search/SearchButton.js +9 -8
  42. package/dist/Editor/Elements/Search/SearchList.js +9 -7
  43. package/dist/Editor/Elements/Signature/Signature.css +2 -1
  44. package/dist/Editor/Elements/Signature/SignatureOptions/DrawSignature.js +18 -5
  45. package/dist/Editor/Elements/Signature/SignatureOptions/UploadSignature.js +16 -3
  46. package/dist/Editor/Elements/SimpleText/index.js +6 -1
  47. package/dist/Editor/Elements/SimpleText/style.js +2 -2
  48. package/dist/Editor/Elements/Table/DragButton.js +0 -1
  49. package/dist/Editor/Elements/Table/Draggable.js +6 -2
  50. package/dist/Editor/Elements/Table/Styles.js +7 -0
  51. package/dist/Editor/Elements/Table/Table.js +3 -3
  52. package/dist/Editor/Elements/Table/TableCell.js +31 -8
  53. package/dist/Editor/Elements/Title/title.js +6 -6
  54. package/dist/Editor/Elements/Variables/VariableButton.js +10 -1
  55. package/dist/Editor/MiniEditor.js +2 -1
  56. package/dist/Editor/Styles/EditorStyles.js +5 -5
  57. package/dist/Editor/Toolbar/FormatTools/Dropdown.js +27 -3
  58. package/dist/Editor/Toolbar/FormatTools/FontFamilyAutocomplete.js +4 -3
  59. package/dist/Editor/Toolbar/FormatTools/MarkButton.js +2 -2
  60. package/dist/Editor/Toolbar/FormatTools/TextSize.js +10 -13
  61. package/dist/Editor/Toolbar/Mini/MiniToolbar.js +2 -1
  62. package/dist/Editor/Toolbar/PopupTool/MiniTextFormat/MiniColorPicker.js +4 -2
  63. package/dist/Editor/Toolbar/PopupTool/MiniTextFormat/SelectFontSize.js +6 -13
  64. package/dist/Editor/Toolbar/PopupTool/MiniTextFormat/SelectTypography.js +167 -42
  65. package/dist/Editor/Toolbar/PopupTool/MiniTextFormat/index.js +7 -4
  66. package/dist/Editor/Toolbar/PopupTool/PopperHeader.js +2 -1
  67. package/dist/Editor/Toolbar/PopupTool/PopupToolStyle.js +72 -12
  68. package/dist/Editor/Toolbar/PopupTool/TextFormat.js +100 -27
  69. package/dist/Editor/Toolbar/PopupTool/ThemeTextFormat.js +439 -0
  70. package/dist/Editor/Toolbar/PopupTool/index.js +1 -1
  71. package/dist/Editor/Toolbar/toolbarGroups.js +48 -6
  72. package/dist/Editor/assets/svg/BackIcon.js +18 -0
  73. package/dist/Editor/assets/svg/ClearAllRounded.js +31 -0
  74. package/dist/Editor/assets/svg/ResetIconNew.js +23 -0
  75. package/dist/Editor/assets/svg/SettingsIcon.js +1 -0
  76. package/dist/Editor/assets/svg/ThemeIcons.js +293 -0
  77. package/dist/Editor/common/Checkbox/index.js +46 -0
  78. package/dist/Editor/common/Checkbox/styles.js +45 -0
  79. package/dist/Editor/common/ColorPickerButton.js +41 -16
  80. package/dist/Editor/common/CustomColorPicker/index.js +130 -0
  81. package/dist/Editor/common/CustomColorPicker/style.js +53 -0
  82. package/dist/Editor/common/CustomDialog2/index.js +94 -0
  83. package/dist/Editor/common/CustomDialog2/style.js +67 -0
  84. package/dist/Editor/common/CustomSelect.js +43 -0
  85. package/dist/Editor/common/DnD/DragHandleButton.js +1 -1
  86. package/dist/Editor/common/FontLoader/FontLoader.js +3 -0
  87. package/dist/Editor/common/Icon.js +31 -1
  88. package/dist/Editor/common/ImageSelector/ImageSelector.js +2 -2
  89. package/dist/Editor/common/ImageSelector/Styles.js +3 -9
  90. package/dist/Editor/common/LinkSettings/NavComponents.js +61 -55
  91. package/dist/Editor/common/LinkSettings/index.js +82 -79
  92. package/dist/Editor/common/LinkSettings/navOptions.js +2 -2
  93. package/dist/Editor/common/LinkSettings/style.js +209 -74
  94. package/dist/Editor/common/RadioGroup/index.js +48 -0
  95. package/dist/Editor/common/RadioGroup/styles.js +29 -0
  96. package/dist/Editor/common/RnD/ElementOptions/Actions.js +13 -15
  97. package/dist/Editor/common/RnD/ElementOptions/Icons/LinkIcon.js +1 -0
  98. package/dist/Editor/common/RnD/ElementOptions/index.js +2 -2
  99. package/dist/Editor/common/RnD/ElementOptions/styles.js +28 -1
  100. package/dist/Editor/common/RnD/ElementSettings/OtherSettings/Settings.js +6 -5
  101. package/dist/Editor/common/RnD/ElementSettings/OtherSettings/Signature.js +4 -3
  102. package/dist/Editor/common/RnD/ElementSettings/Settings/AppHeaderSettings.js +3 -2
  103. package/dist/Editor/common/RnD/ElementSettings/Settings/BoxSettings.js +3 -2
  104. package/dist/Editor/common/RnD/ElementSettings/Settings/ButtonSettings.js +3 -2
  105. package/dist/Editor/common/RnD/ElementSettings/Settings/CodeSettings.js +3 -2
  106. package/dist/Editor/common/RnD/ElementSettings/Settings/FormSettings.js +4 -2
  107. package/dist/Editor/common/RnD/ElementSettings/Settings/ImageSettings.js +3 -2
  108. package/dist/Editor/common/RnD/ElementSettings/Settings/TableSettings.js +3 -2
  109. package/dist/Editor/common/RnD/ElementSettings/Settings/TextSettings.js +3 -1
  110. package/dist/Editor/common/RnD/ElementSettings/Settings/VideoSettings.js +3 -2
  111. package/dist/Editor/common/RnD/ElementSettings/styles.js +146 -12
  112. package/dist/Editor/common/RnD/OptionsPopup/index.js +8 -5
  113. package/dist/Editor/common/RnD/OptionsPopup/style.js +120 -19
  114. package/dist/Editor/common/RnD/SwitchViewport/SwitchViewport.js +8 -5
  115. package/dist/Editor/common/RnD/Theme/MainThemeProvider.js +17 -0
  116. package/dist/Editor/common/RnD/Theme/ViewportStimulator.js +6 -3
  117. package/dist/Editor/common/RnD/Utils/gridDropItem.js +28 -19
  118. package/dist/Editor/common/RnD/Utils/index.js +3 -1
  119. package/dist/Editor/common/RnD/VirtualElement/VirtualTextElement.js +48 -54
  120. package/dist/Editor/common/RnD/VirtualElement/helper.js +143 -131
  121. package/dist/Editor/common/RnD/VirtualElement/styles.js +16 -0
  122. package/dist/Editor/common/RnD/index.js +6 -11
  123. package/dist/Editor/common/Select/index.js +44 -5
  124. package/dist/Editor/common/Select/styles.js +30 -2
  125. package/dist/Editor/common/Shorthands/elements.js +65 -11
  126. package/dist/Editor/common/SnackBar/index.js +43 -0
  127. package/dist/Editor/common/StyleBuilder/accordionTitleBtnStyle.js +2 -2
  128. package/dist/Editor/common/StyleBuilder/accordionTitleStyle.js +12 -9
  129. package/dist/Editor/common/StyleBuilder/buttonStyle.js +4 -2
  130. package/dist/Editor/common/StyleBuilder/embedVideoStyle.js +4 -0
  131. package/dist/Editor/common/StyleBuilder/fieldTypes/backgroundImage.js +5 -0
  132. package/dist/Editor/common/StyleBuilder/fieldTypes/bannerSpacing.js +12 -2
  133. package/dist/Editor/common/StyleBuilder/fieldTypes/borderRadius.js +15 -7
  134. package/dist/Editor/common/StyleBuilder/fieldTypes/card.js +16 -8
  135. package/dist/Editor/common/StyleBuilder/fieldTypes/color.js +36 -10
  136. package/dist/Editor/common/StyleBuilder/fieldTypes/embedUpload.js +115 -0
  137. package/dist/Editor/common/StyleBuilder/fieldTypes/fontSize.js +16 -7
  138. package/dist/Editor/common/StyleBuilder/fieldTypes/index.js +3 -1
  139. package/dist/Editor/common/StyleBuilder/fieldTypes/lineSpacing.js +7 -6
  140. package/dist/Editor/common/StyleBuilder/fieldTypes/menusArray.js +13 -6
  141. package/dist/Editor/common/StyleBuilder/fieldTypes/textOptions.js +15 -7
  142. package/dist/Editor/common/StyleBuilder/pageSettingsStyle.js +5 -7
  143. package/dist/Editor/common/SwipeableDrawer/style.js +14 -12
  144. package/dist/Editor/common/Uploader.js +16 -0
  145. package/dist/Editor/common/iconListV2.js +177 -6
  146. package/dist/Editor/common/iconslist.js +24 -0
  147. package/dist/Editor/commonStyle.js +186 -62
  148. package/dist/Editor/helper/index.js +4 -0
  149. package/dist/Editor/helper/textIndeces.js +58 -0
  150. package/dist/Editor/helper/theme.js +203 -2
  151. package/dist/Editor/hooks/useEditorTheme.js +153 -0
  152. package/dist/Editor/hooks/useMouseMove.js +8 -5
  153. package/dist/Editor/hooks/useTable.js +5 -4
  154. package/dist/Editor/hooks/useThemeValues.js +63 -0
  155. package/dist/Editor/plugins/withEmbeds.js +1 -1
  156. package/dist/Editor/plugins/withHTML.js +3 -1
  157. package/dist/Editor/plugins/withTable.js +1 -1
  158. package/dist/Editor/theme/ThemeList.js +50 -173
  159. package/dist/Editor/theme/index.js +149 -0
  160. package/dist/Editor/themeSettings/ActiveTheme.js +82 -0
  161. package/dist/Editor/themeSettings/buttons/index.js +300 -0
  162. package/dist/Editor/themeSettings/buttons/style.js +23 -0
  163. package/dist/Editor/themeSettings/colorTheme/index.js +310 -0
  164. package/dist/Editor/themeSettings/colorTheme/style.js +81 -0
  165. package/dist/Editor/themeSettings/fonts/PreviewElement.js +121 -0
  166. package/dist/Editor/themeSettings/fonts/index.js +240 -0
  167. package/dist/Editor/themeSettings/fonts/style.js +62 -0
  168. package/dist/Editor/themeSettings/icons.js +60 -0
  169. package/dist/Editor/themeSettings/index.js +367 -0
  170. package/dist/Editor/themeSettings/style.js +299 -0
  171. package/dist/Editor/themeSettingsAI/icons.js +96 -0
  172. package/dist/Editor/themeSettingsAI/index.js +355 -0
  173. package/dist/Editor/themeSettingsAI/saveTheme.js +202 -0
  174. package/dist/Editor/themeSettingsAI/style.js +332 -0
  175. package/dist/Editor/utils/SlateUtilityFunctions.js +169 -45
  176. package/dist/Editor/utils/accordion.js +14 -4
  177. package/dist/Editor/utils/button.js +1 -17
  178. package/dist/Editor/utils/customHooks/useTableResize.js +49 -9
  179. package/dist/Editor/utils/draftToSlate.js +3 -2
  180. package/dist/Editor/utils/events.js +50 -6
  181. package/dist/Editor/utils/font.js +40 -37
  182. package/dist/Editor/utils/form.js +4 -4
  183. package/dist/Editor/utils/formfield.js +8 -2
  184. package/dist/Editor/utils/helper.js +134 -26
  185. package/dist/Editor/utils/insertAppHeader.js +1 -1
  186. package/dist/Editor/utils/signature.js +2 -9
  187. package/package.json +4 -4
@@ -1,5 +1,6 @@
1
1
  import { ROW_HEIGHT, calculateGridArea } from "../Utils/gridDropItem";
2
2
  import { Transforms, Editor } from "slate";
3
+ import { getElementOffset } from "./VirtualTextElement";
3
4
  const isBulletOrTickIcon = (width, itemStartRow, startRow) => {
4
5
  return width <= 40 && itemStartRow === startRow;
5
6
  };
@@ -39,106 +40,83 @@ export const getGridArea = gridArea => {
39
40
  const getBoxToAutoAlign = (editor, sectionPath) => {
40
41
  const [boxData] = Editor.nodes(editor, {
41
42
  at: sectionPath,
42
- match: node => node.type === "freegridBox" && node.autoAlign
43
+ match: node => ["freegridBox", "freegrid"].includes(node.type) && node.autoAlign
43
44
  });
44
45
  return boxData || [];
45
46
  };
46
- const handleGridItems = (gridItems, lastRow) => {
47
- // to find the previously occupied rows
48
- gridItems.forEach(item => {
49
- const {
50
- gridArea_xs: gridArea,
51
- marginTop_xs,
52
- height_xs,
53
- type
54
- } = item;
55
- if (type === "paragraph") {
56
- // non-freegridItem,
57
- // some "paragraph" node is defaulty coming inside in box's children
58
- return;
59
- }
60
- const [startRow] = getGridArea(gridArea);
61
- const marginTop = marginTop_xs ? Number(marginTop_xs) : 0;
62
- const fullHeight = Number(height_xs) + marginTop;
63
- const endRow = startRow + Math.floor(fullHeight / ROW_HEIGHT) + 1;
64
- lastRow = Math.max(endRow, lastRow);
65
- });
66
- return {
67
- lastRow
68
- };
69
- };
70
- const handleNonGridItems = (nonGridItems, lastRow, editor, boxPath) => {
71
- let containerHeight = (lastRow - 1) * ROW_HEIGHT;
72
- let newlyAddedHeight = 0;
73
47
 
74
- //place it on the next rows that are available
75
- nonGridItems.forEach((item, index) => {
76
- const {
77
- height_xs,
78
- type,
79
- itemIndex
80
- } = item;
81
- if (type === "paragraph") {
82
- // non-freegridItem
83
- return;
84
- }
85
- const startRow = lastRow || 1;
86
- const DEFAULT_NEW_ELEMENT_MARGIN_TOP = 12;
87
- let fullHeight = height_xs + DEFAULT_NEW_ELEMENT_MARGIN_TOP;
88
- const endRow = startRow + Math.floor(fullHeight / ROW_HEIGHT) + 1;
89
- const newGridArea = `${startRow} / 1 / ${startRow + 1} / 2`;
90
- const currentElementPath = [...boxPath, itemIndex];
91
- Transforms.setNodes(editor, {
92
- gridArea_xs: newGridArea,
93
- marginTop_xs: 12,
94
- left_xs: 12,
95
- xs_updatedOn: new Date().getTime()
96
- }, {
97
- at: currentElementPath
98
- });
99
- lastRow = Math.max(endRow, lastRow);
100
- containerHeight += fullHeight;
101
- newlyAddedHeight += fullHeight;
102
- });
103
- return {
104
- lastRow,
105
- containerHeight,
106
- newlyAddedHeight
107
- };
108
- };
109
- const alignNewElementInContainer = (editor, boxPath, containerItems) => {
110
- let lastRow = 1;
111
- const gridItems = [];
112
- const nonGridItems = [];
113
- containerItems.forEach((item, index) => {
114
- if (item?.gridArea_xs) {
115
- gridItems.push({
116
- ...item,
117
- itemIndex: index
118
- });
119
- } else {
120
- nonGridItems.push({
121
- ...item,
122
- itemIndex: index
123
- });
124
- }
125
- });
126
- const {
127
- lastRow: lastRowOccupied
128
- } = handleGridItems(gridItems, lastRow);
129
- lastRow = lastRowOccupied;
130
- const {
131
- lastRow: lastRowTaken,
132
- containerHeight,
133
- newlyAddedHeight
134
- } = handleNonGridItems(nonGridItems, lastRow, editor, boxPath);
135
- lastRow = lastRowTaken;
136
- return {
137
- lastRow,
138
- containerHeight,
139
- newlyAddedHeight
140
- };
141
- };
48
+ // const handleGridItems = (gridItems, lastRow) => {
49
+ // // to find the previously occupied rows
50
+ // gridItems.forEach((item) => {
51
+ // const { gridArea_xs: gridArea, marginTop_xs, height_xs, type } = item;
52
+
53
+ // if (type === "paragraph") {
54
+ // // non-freegridItem,
55
+ // // some "paragraph" node is defaulty coming inside in box's children
56
+ // return;
57
+ // }
58
+
59
+ // const [startRow] = getGridArea(gridArea);
60
+ // const marginTop = marginTop_xs ? Number(marginTop_xs) : 0;
61
+ // const fullHeight = Number(height_xs) + marginTop;
62
+
63
+ // const endRow = startRow + Math.floor(fullHeight / ROW_HEIGHT) + 1;
64
+
65
+ // lastRow = Math.max(endRow, lastRow);
66
+ // });
67
+
68
+ // return { lastRow };
69
+ // };
70
+
71
+ // const handleNonGridItems = (nonGridItems, lastRow, editor, boxPath) => {
72
+ // let containerHeight = (lastRow - 1) * ROW_HEIGHT;
73
+
74
+ // let newlyAddedHeight = 0;
75
+
76
+ // //place it on the next rows that are available
77
+ // nonGridItems.forEach((item, index) => {
78
+ // const { height_xs, type, itemIndex } = item;
79
+
80
+ // if (type === "paragraph") {
81
+ // // non-freegridItem
82
+ // return;
83
+ // }
84
+
85
+ // const startRow = lastRow || 1;
86
+
87
+ // const DEFAULT_NEW_ELEMENT_MARGIN_TOP = 12;
88
+ // let fullHeight = height_xs + DEFAULT_NEW_ELEMENT_MARGIN_TOP;
89
+
90
+ // const endRow = startRow + Math.floor(fullHeight / ROW_HEIGHT) + 1;
91
+
92
+ // const newGridArea = `${startRow} / 1 / ${startRow + 1} / 2`;
93
+
94
+ // const currentElementPath = [...boxPath, itemIndex];
95
+
96
+ // Transforms.setNodes(
97
+ // editor,
98
+ // {
99
+ // gridArea_xs: newGridArea,
100
+ // marginTop_xs: 12,
101
+ // left_xs: 12,
102
+ // xs_updatedOn: new Date().getTime(),
103
+ // },
104
+ // { at: currentElementPath }
105
+ // );
106
+
107
+ // lastRow = Math.max(endRow, lastRow);
108
+
109
+ // containerHeight += fullHeight;
110
+ // newlyAddedHeight += fullHeight;
111
+ // });
112
+
113
+ // return {
114
+ // lastRow,
115
+ // containerHeight,
116
+ // newlyAddedHeight,
117
+ // };
118
+ // };
119
+
142
120
  const getAncestorFreeGridContainers = (editor, path) => {
143
121
  const containers = [...Editor.nodes(editor, {
144
122
  at: path,
@@ -151,6 +129,12 @@ const getAncestorFreeGridContainers = (editor, path) => {
151
129
  })].filter(([node, nodePath]) => nodePath.length <= path.length);
152
130
  return containers;
153
131
  };
132
+ export const handleTextAlignment = (editor, textNode, heightDiff) => {
133
+ const [, textPath] = textNode;
134
+ let containers = getAncestorFreeGridContainers(editor, textPath);
135
+ containers = [...containers, textNode];
136
+ handleContainersAlignment(editor, containers, heightDiff, 0);
137
+ };
154
138
  export const handleContainers = (editor, boxPath, extraHeight) => {
155
139
  const containers = getAncestorFreeGridContainers(editor, boxPath);
156
140
  let lastChildStartRow;
@@ -213,6 +197,7 @@ export const moveOverlappedItems = (editor, moveRows, containerItems, containerP
213
197
  return;
214
198
  }
215
199
  if (gridItem.type === "paragraph") {
200
+ // some empty paragraph node is inserted default'ly inside box, to avoid that
216
201
  return;
217
202
  }
218
203
  const {
@@ -235,7 +220,61 @@ export const moveOverlappedItems = (editor, moveRows, containerItems, containerP
235
220
  }
236
221
  });
237
222
  };
238
- export const handleBoxAlignment = (editor, sectionNode, sectionPath) => {
223
+ export const handleContainersAlignment = (editor, containers, heightDiff, bufferSpace = 0) => {
224
+ for (let i = containers.length - 1; i >= 0; i--) {
225
+ const container = containers[i];
226
+ const childContainer = containers[i + 1];
227
+ const [containerNode, containerPath] = container;
228
+ const [childContainerNode, childContainerPath] = childContainer || [];
229
+ if (childContainer) {
230
+ const {
231
+ bottom
232
+ } = getElementOffset(childContainerNode);
233
+ containerNode.children.forEach((item, index) => {
234
+ const currPath = [...containerPath, index];
235
+ if (currPath.toString() === childContainerPath.toString()) {
236
+ return;
237
+ }
238
+ if (item.type === "paragraph") {
239
+ return;
240
+ }
241
+ const {
242
+ top: itemTop
243
+ } = getElementOffset(item);
244
+ if (itemTop >= bottom) {
245
+ const {
246
+ gridArea_xs,
247
+ marginTop_xs
248
+ } = item;
249
+ const [startRow] = getGridArea(gridArea_xs);
250
+ const y = (startRow - 1) * ROW_HEIGHT + marginTop_xs + heightDiff;
251
+
252
+ // Calculate grid position
253
+ const row = Math.floor(y / ROW_HEIGHT) + 1;
254
+
255
+ // to calculate difference inside the grid
256
+ const marginTop = Math.abs((row - 1) * ROW_HEIGHT - y);
257
+
258
+ // Update grid area
259
+ const gridArea = `${row} / 1 / ${row + 1} / 2`;
260
+ Transforms.setNodes(editor, {
261
+ gridArea_xs: gridArea,
262
+ marginTop_xs: marginTop + bufferSpace
263
+ }, {
264
+ at: currPath
265
+ });
266
+ }
267
+ });
268
+ }
269
+ Transforms.setNodes(editor, {
270
+ height_xs: containerNode?.height_xs + heightDiff + bufferSpace,
271
+ xs_updatedOn: new Date().getTime()
272
+ }, {
273
+ at: containerPath
274
+ });
275
+ }
276
+ };
277
+ export const handleBoxAlignment = (editor, sectionPath, heightDiff) => {
239
278
  const [boxNode, boxPath] = getBoxToAutoAlign(editor, sectionPath);
240
279
  Transforms.setNodes(editor, {
241
280
  autoAlign: false
@@ -245,39 +284,11 @@ export const handleBoxAlignment = (editor, sectionNode, sectionPath) => {
245
284
  if (!boxNode) {
246
285
  return;
247
286
  }
248
- const containerItems = boxNode?.children || [];
249
- const {
250
- containerHeight
251
- } = alignNewElementInContainer(editor, boxPath, containerItems);
252
- const bufferHeight = 12;
253
- const newHeight = containerHeight + bufferHeight;
254
- const {
255
- height_xs
256
- } = boxNode;
257
- const oldHeight = Number(height_xs);
258
- const extraHeight = newHeight - oldHeight;
259
- if (extraHeight > 0) {
260
- const containerData = handleContainers(editor, boxPath, extraHeight);
261
- containerData.forEach(container => {
262
- const {
263
- moveRows,
264
- containerNode,
265
- containerPath,
266
- newHeight,
267
- childIndex,
268
- lastChildStartRow
269
- } = container;
270
- if (moveRows) {
271
- moveOverlappedItems(editor, moveRows, containerNode?.children, containerPath, childIndex, lastChildStartRow);
272
- }
273
- Transforms.setNodes(editor, {
274
- height_xs: newHeight,
275
- xs_updatedOn: new Date().getTime()
276
- }, {
277
- at: containerPath
278
- });
279
- });
287
+ if (heightDiff <= 0) {
288
+ return;
280
289
  }
290
+ let containers = getAncestorFreeGridContainers(editor, boxPath);
291
+ handleContainersAlignment(editor, containers, heightDiff, 12);
281
292
  };
282
293
  export const getMarginTop = y => {
283
294
  const calcMargin = y % ROW_HEIGHT;
@@ -295,7 +306,7 @@ export const calculateProps = (curPath, dom, domClass, allData, parentDom, isBox
295
306
  const itemsData = [];
296
307
  const items = dom.querySelectorAll(domClass);
297
308
  const nextItemPathLength = curPath?.split("|").length + 2;
298
- let sectionHeight = 12;
309
+ // let sectionHeight = 12;
299
310
  for (let i = 0; i < items.length; i++) {
300
311
  const itemRect = items[i]?.getBoundingClientRect();
301
312
  if (items[i]?.classList.contains("type_box")) {
@@ -315,9 +326,10 @@ export const calculateProps = (curPath, dom, domClass, allData, parentDom, isBox
315
326
  gridArea: calculateGridArea(y)
316
327
  }
317
328
  });
318
- sectionHeight += itemRect?.height;
329
+ // sectionHeight += itemRect?.height;
319
330
  }
320
331
  }
332
+
321
333
  if (dom?.classList.contains("type_box") && parentDom) {
322
334
  const parentDomRect = parentDom?.getBoundingClientRect();
323
335
  const isAppHeader = isBoxHeader || dom?.classList.contains("appHeaderBox");
@@ -18,6 +18,14 @@ const useVirtualElementStyles = () => ({
18
18
  "& .editor-blocker": {
19
19
  display: "none"
20
20
  },
21
+ "& .fgi_type_text": {
22
+ "& .edt-headings": {
23
+ margin: "0px"
24
+ },
25
+ "& .edt-paragraphs": {
26
+ margin: "0px"
27
+ }
28
+ },
21
29
  "& .freegrid-item": {
22
30
  position: "relative !important",
23
31
  top: "0 !important",
@@ -97,6 +105,14 @@ export const useAutoAlignStyles = () => ({
97
105
  "&.type_text": {
98
106
  height: "auto !important"
99
107
  },
108
+ "& .fgi_type_text": {
109
+ "& .edt-headings": {
110
+ margin: "0px"
111
+ },
112
+ "& .edt-paragraphs": {
113
+ margin: "0px"
114
+ }
115
+ },
100
116
  // start - default signature classes on free-grid
101
117
  "& .fgi_type_signature": {
102
118
  height: "100%",
@@ -12,7 +12,7 @@ import GuideLines from "./GuideLines";
12
12
  import ShadowElement from "./ShadowElement";
13
13
  import BoundaryLine from "./GuideLines/BoundaryLine";
14
14
  import ContextMenu from "./ContextMenu";
15
- import VirtualElement from "./VirtualElement";
15
+ // import VirtualElement from "./VirtualElement";
16
16
  import { ItemTypes } from "./ElementSettings/settingsConstants";
17
17
  import { selectText } from "../../utils/helper";
18
18
  import { removeSign } from "./ElementSettings/OtherSettings";
@@ -127,7 +127,7 @@ const RnD = props => {
127
127
  isInteracting,
128
128
  handleStart,
129
129
  handleStop
130
- } = useFreeGrid() || {};
130
+ } = useFreeGrid();
131
131
  const {
132
132
  translation
133
133
  } = customProps;
@@ -499,7 +499,9 @@ const RnD = props => {
499
499
  ref
500
500
  }, ".freegrid-container-parent");
501
501
  const formatParentPath = parentPath?.split("|")?.map(m => parseInt(m));
502
- reRenderChildNodes(editor, formatParentPath);
502
+ if (formatParentPath) {
503
+ reRenderChildNodes(editor, formatParentPath);
504
+ }
503
505
  };
504
506
  const onCloseSettings = () => {
505
507
  setSelectedElement({
@@ -681,14 +683,7 @@ const RnD = props => {
681
683
  handleClose: handleClose,
682
684
  theme: theme,
683
685
  translation: translation
684
- }), type === "parent" && breakpoint === "lg" && !readOnly ? /*#__PURE__*/_jsx(VirtualElement, {
685
- updated_at: updated_at,
686
- path: str_path,
687
- editor: editor,
688
- sectionElement: sectionElement,
689
- sectionCls: `.freegrid-section_${path.join("_")}`,
690
- dataSets: dataSets
691
- }) : null, childType === "text" && breakpoint === "lg" && !readOnly && enable ? /*#__PURE__*/_jsx(VirtualTextElement, {
686
+ }), childType === "text" && breakpoint === "lg" && !readOnly && enable ? /*#__PURE__*/_jsx(VirtualTextElement, {
692
687
  editor: editor,
693
688
  dataSets: dataSets,
694
689
  getCurrentEle: getCurrentEle,
@@ -1,20 +1,59 @@
1
- import { Select as Core } from "@mui/material";
1
+ import { Select as Core, MenuItem, Typography } from "@mui/material";
2
2
  import SelectStyles from "./styles";
3
3
  import { useEditorContext } from "../../hooks/useMouseMove";
4
+ import KeyboardArrowDownRoundedIcon from "@mui/icons-material/KeyboardArrowDownRounded";
4
5
  import { jsx as _jsx } from "react/jsx-runtime";
6
+ import { Fragment as _Fragment } from "react/jsx-runtime";
7
+ import { jsxs as _jsxs } from "react/jsx-runtime";
5
8
  function Select(props) {
6
9
  const {
7
10
  children,
11
+ value,
12
+ onChange,
13
+ options,
14
+ label,
15
+ labelProps,
16
+ showDefault,
17
+ translation,
8
18
  ...rest
9
19
  } = props;
10
20
  const {
11
21
  theme
12
22
  } = useEditorContext();
13
23
  const classes = SelectStyles(theme);
14
- return /*#__PURE__*/_jsx(Core, {
15
- MenuProps: classes.MenuProps,
16
- ...rest,
17
- children: children
24
+ const menuOptions = showDefault ? [{
25
+ label: "None",
26
+ value: ""
27
+ }, ...(options || [])] : options;
28
+ return /*#__PURE__*/_jsxs(_Fragment, {
29
+ children: [label ? /*#__PURE__*/_jsx(Typography, {
30
+ variant: "body2",
31
+ sx: {
32
+ paddingBottom: "4px"
33
+ },
34
+ ...(labelProps || {}),
35
+ children: label
36
+ }) : null, /*#__PURE__*/_jsx(Core, {
37
+ size: "small",
38
+ fullWidth: true,
39
+ defaultValue: "",
40
+ value: value || "",
41
+ onChange: onChange,
42
+ sx: classes.select,
43
+ MenuProps: classes.MenuProps,
44
+ IconComponent: KeyboardArrowDownRoundedIcon,
45
+ displayEmpty: true,
46
+ ...rest,
47
+ children: menuOptions?.map((option, i) => {
48
+ return /*#__PURE__*/_jsx(MenuItem, {
49
+ value: option.value,
50
+ children: /*#__PURE__*/_jsx(Typography, {
51
+ variant: "body2",
52
+ children: translation(option.label)
53
+ })
54
+ }, i);
55
+ })
56
+ })]
18
57
  });
19
58
  }
20
59
  export default Select;
@@ -1,16 +1,44 @@
1
1
  const SelectStyles = (theme = {}) => {
2
2
  const {
3
3
  textColor,
4
- background
4
+ textWeightPopUpBackground,
5
+ menuOptionSelectedOption
5
6
  } = theme?.palette?.editor || {};
6
7
  return {
7
8
  MenuProps: {
9
+ sx: {
10
+ zIndex: "1302 !important"
11
+ },
8
12
  PaperProps: {
9
13
  sx: {
14
+ background: textWeightPopUpBackground,
10
15
  color: textColor,
11
- background
16
+ borderRadius: "8px",
17
+ marginTop: "2px",
18
+ "& li": {
19
+ padding: "6px 16px",
20
+ margin: "5px !important",
21
+ borderRadius: "4px !important"
22
+ },
23
+ "& .MuiList-root": {
24
+ padding: "0px"
25
+ },
26
+ "& .MuiTypography-root": {
27
+ fontSize: "12px !important",
28
+ fontWeight: 500,
29
+ fontFamily: "'Inter',sans-serif"
30
+ },
31
+ "& .Mui-selected": {
32
+ background: menuOptionSelectedOption,
33
+ color: textColor
34
+ }
12
35
  }
13
36
  }
37
+ },
38
+ select: {
39
+ "& .MuiSelect-icon": {
40
+ color: "#64748B !important"
41
+ }
14
42
  }
15
43
  };
16
44
  };
@@ -18,6 +18,17 @@ import SearchButton from "../../Elements/Search/SearchButton";
18
18
  import canOpen from "../../helper/canOpen";
19
19
  import { jsx as _jsx } from "react/jsx-runtime";
20
20
  const ELEMENTS_LIST = [{
21
+ name: "Ask AI to write anything",
22
+ group: "Infinity AI",
23
+ desc: "",
24
+ type: "infinityAI",
25
+ icon: /*#__PURE__*/_jsx(Icon, {
26
+ icon: "infinityIcon"
27
+ }),
28
+ onInsert: editor => {
29
+ insertInfinityAI(editor);
30
+ }
31
+ }, {
21
32
  name: "Heading 1",
22
33
  desc: "",
23
34
  group: "Text",
@@ -44,6 +55,60 @@ const ELEMENTS_LIST = [{
44
55
  icon: "headingThree"
45
56
  }),
46
57
  onInsert: editor => toggleBlock(editor, "headingThree", false)
58
+ }, {
59
+ name: "Heading 4",
60
+ desc: "",
61
+ group: "Text",
62
+ type: "headingFour",
63
+ icon: /*#__PURE__*/_jsx(Icon, {
64
+ icon: "headingFour"
65
+ }),
66
+ onInsert: editor => toggleBlock(editor, "headingFour", false)
67
+ }, {
68
+ name: "Heading 5",
69
+ desc: "",
70
+ group: "Text",
71
+ type: "headingFive",
72
+ icon: /*#__PURE__*/_jsx(Icon, {
73
+ icon: "headingFive"
74
+ }),
75
+ onInsert: editor => toggleBlock(editor, "headingFive", false)
76
+ }, {
77
+ name: "Heading 6",
78
+ desc: "",
79
+ group: "Text",
80
+ type: "headingSix",
81
+ icon: /*#__PURE__*/_jsx(Icon, {
82
+ icon: "headingSix"
83
+ }),
84
+ onInsert: editor => toggleBlock(editor, "headingSix", false)
85
+ }, {
86
+ name: "Paragraph 1",
87
+ desc: "",
88
+ group: "Text",
89
+ type: "paragraphOne",
90
+ icon: /*#__PURE__*/_jsx(Icon, {
91
+ icon: "paragraphOne"
92
+ }),
93
+ onInsert: editor => toggleBlock(editor, "paragraphOne", false)
94
+ }, {
95
+ name: "Paragraph 2",
96
+ desc: "",
97
+ group: "Text",
98
+ type: "paragraphTwo",
99
+ icon: /*#__PURE__*/_jsx(Icon, {
100
+ icon: "paragraphTwo"
101
+ }),
102
+ onInsert: editor => toggleBlock(editor, "paragraphTwo", false)
103
+ }, {
104
+ name: "Paragraph 3",
105
+ desc: "",
106
+ group: "Text",
107
+ type: "paragraphThree",
108
+ icon: /*#__PURE__*/_jsx(Icon, {
109
+ icon: "paragraphThree"
110
+ }),
111
+ onInsert: editor => toggleBlock(editor, "paragraphThree", false)
47
112
  }, {
48
113
  name: "Quote",
49
114
  desc: "",
@@ -276,17 +341,6 @@ const ELEMENTS_LIST = [{
276
341
  onInsert: editor => {
277
342
  insertForm(editor);
278
343
  }
279
- }, {
280
- name: "Ask AI to write anything",
281
- group: "Infinity AI",
282
- desc: "",
283
- type: "infinityAI",
284
- icon: /*#__PURE__*/_jsx(Icon, {
285
- icon: "infinityIcon"
286
- }),
287
- onInsert: editor => {
288
- insertInfinityAI(editor);
289
- }
290
344
  }, {
291
345
  name: "Dynamic Table",
292
346
  group: "Dynamic Table",
@@ -0,0 +1,43 @@
1
+ import Snackbar from "@mui/material/Snackbar";
2
+ import Alert from "@mui/material/Alert";
3
+ import { useState } from "react";
4
+ import { useEditorContext } from "../../hooks/useMouseMove";
5
+ import { jsx as _jsx } from "react/jsx-runtime";
6
+ const SnackbarAlert = ({
7
+ message,
8
+ setShowSnackBar,
9
+ severity = "info"
10
+ }) => {
11
+ const [open, setOpen] = useState(!!message);
12
+ const {
13
+ theme
14
+ } = useEditorContext();
15
+ return /*#__PURE__*/_jsx(Snackbar, {
16
+ open: open,
17
+ autoHideDuration: 3000,
18
+ onClose: () => {
19
+ setOpen(false);
20
+ setShowSnackBar(false);
21
+ },
22
+ anchorOrigin: {
23
+ vertical: "top",
24
+ horizontal: "right"
25
+ },
26
+ children: /*#__PURE__*/_jsx(Alert, {
27
+ severity: severity,
28
+ onClose: () => {
29
+ setOpen(false);
30
+ setShowSnackBar(false);
31
+ },
32
+ sx: {
33
+ background: theme?.palette?.primary?.gradientBtn,
34
+ color: "#FFFFFF",
35
+ "& .MuiAlert-icon": {
36
+ color: "#FFFFFF"
37
+ }
38
+ },
39
+ children: message
40
+ })
41
+ });
42
+ };
43
+ export default SnackbarAlert;
@@ -8,11 +8,11 @@ const accordionTitleBtnStyle = [{
8
8
  needPreview: true,
9
9
  hideGradient: true
10
10
  }, {
11
- label: "Accordion Background Color",
11
+ label: "Background Color",
12
12
  key: "accordionBgColor",
13
13
  type: "color"
14
14
  }, {
15
- label: "Accordion Border Color",
15
+ label: "Border Color",
16
16
  key: "accordionBorderColor",
17
17
  type: "color"
18
18
  }]