@flozy/editor 3.8.9 → 3.9.1

Sign up to get free protection for your applications and to get access to all the features.
Files changed (194) hide show
  1. package/dist/Editor/ChatEditor.js +55 -45
  2. package/dist/Editor/CommonEditor.js +175 -168
  3. package/dist/Editor/DialogWrapper.js +3 -4
  4. package/dist/Editor/Editor.css +7 -4
  5. package/dist/Editor/Elements/AI/AIInput.js +17 -18
  6. package/dist/Editor/Elements/AI/CustomSelect.js +19 -12
  7. package/dist/Editor/Elements/AI/PopoverAIInput.js +58 -74
  8. package/dist/Editor/Elements/AI/Styles.js +2 -1
  9. package/dist/Editor/Elements/AI/VoiceToText/AudioWave.js +73 -0
  10. package/dist/Editor/Elements/AI/VoiceToText/index.js +177 -0
  11. package/dist/Editor/Elements/AI/VoiceToText/style.js +40 -0
  12. package/dist/Editor/Elements/AppHeader/AppHeader.js +49 -40
  13. package/dist/Editor/Elements/Button/EditorButton.js +38 -33
  14. package/dist/Editor/Elements/Color Picker/ColorButtons.js +60 -17
  15. package/dist/Editor/Elements/Color Picker/ColorPicker.css +25 -1
  16. package/dist/Editor/Elements/Color Picker/ColorPicker.js +4 -4
  17. package/dist/Editor/Elements/Color Picker/Styles.js +2 -1
  18. package/dist/Editor/Elements/Embed/Image.js +14 -15
  19. package/dist/Editor/Elements/Embed/Video.js +8 -12
  20. package/dist/Editor/Elements/Emoji/EmojiButton.js +7 -11
  21. package/dist/Editor/Elements/Emoji/EmojiPicker.js +4 -2
  22. package/dist/Editor/Elements/Form/Form.js +1 -1
  23. package/dist/Editor/Elements/Form/Workflow/FormWorkflow.js +12 -3
  24. package/dist/Editor/Elements/Form/Workflow/UserInputs.js +2 -1
  25. package/dist/Editor/Elements/Grid/Grid.js +34 -14
  26. package/dist/Editor/Elements/Grid/GridItem.js +23 -31
  27. package/dist/Editor/Elements/Link/Link.js +6 -1
  28. package/dist/Editor/Elements/Link/LinkButton.js +4 -2
  29. package/dist/Editor/Elements/Link/LinkPopup.js +10 -3
  30. package/dist/Editor/Elements/Link/LinkPopupStyles.js +28 -0
  31. package/dist/Editor/Elements/PageSettings/PageSettingsButton.js +8 -4
  32. package/dist/Editor/Elements/Redo/RedoButton.js +14 -0
  33. package/dist/Editor/Elements/Signature/SignaturePopup.js +14 -3
  34. package/dist/Editor/Elements/SimpleText/index.js +8 -9
  35. package/dist/Editor/Elements/SimpleText/style.js +0 -37
  36. package/dist/Editor/Elements/Table/Styles.js +23 -1
  37. package/dist/Editor/Elements/Table/Table.js +2 -1
  38. package/dist/Editor/Elements/Table/TableCell.js +69 -7
  39. package/dist/Editor/Elements/TableContextMenu/TableContextMenu.js +1 -0
  40. package/dist/Editor/Elements/Undo/UndoButton.js +14 -0
  41. package/dist/Editor/MiniEditor.js +3 -1
  42. package/dist/Editor/Styles/EditorStyles.js +1 -24
  43. package/dist/Editor/Toolbar/Basic/index.js +4 -2
  44. package/dist/Editor/Toolbar/FormatTools/Dropdown.js +26 -2
  45. package/dist/Editor/Toolbar/FormatTools/MarkButton.js +2 -2
  46. package/dist/Editor/Toolbar/FormatTools/TextSize.js +29 -18
  47. package/dist/Editor/Toolbar/Mini/MiniToolbar.js +29 -3
  48. package/dist/Editor/Toolbar/Mini/Options/Options.js +10 -0
  49. package/dist/Editor/Toolbar/Mini/Styles.js +7 -0
  50. package/dist/Editor/Toolbar/PopupTool/MiniTextFormat/SelectFontSize.js +4 -11
  51. package/dist/Editor/Toolbar/PopupTool/MiniTextFormat/SelectTypography.js +213 -86
  52. package/dist/Editor/Toolbar/PopupTool/MiniTextFormat/index.js +2 -1
  53. package/dist/Editor/Toolbar/PopupTool/PopupToolStyle.js +22 -16
  54. package/dist/Editor/Toolbar/PopupTool/TextFormat.js +52 -8
  55. package/dist/Editor/Toolbar/PopupTool/ThemeTextFormat.js +438 -0
  56. package/dist/Editor/Toolbar/PopupTool/index.js +7 -25
  57. package/dist/Editor/Toolbar/Toolbar.js +0 -7
  58. package/dist/Editor/Toolbar/toolbarGroups.js +48 -11
  59. package/dist/Editor/assets/svg/AIIcons.js +153 -1
  60. package/dist/Editor/assets/svg/AddTemplateIcon.js +13 -10
  61. package/dist/Editor/assets/svg/RedoIcon.js +27 -0
  62. package/dist/Editor/assets/svg/SettingsIcon.js +28 -0
  63. package/dist/Editor/assets/svg/TextIcon.js +8 -5
  64. package/dist/Editor/assets/svg/ThemeIcons.js +291 -0
  65. package/dist/Editor/assets/svg/UndoIcon.js +27 -0
  66. package/dist/Editor/common/ColorPickerButton.js +25 -9
  67. package/dist/Editor/common/CustomColorPicker/index.js +106 -0
  68. package/dist/Editor/common/CustomColorPicker/style.js +53 -0
  69. package/dist/Editor/common/CustomDialog/index.js +94 -0
  70. package/dist/Editor/common/CustomDialog/style.js +67 -0
  71. package/dist/Editor/common/CustomSelect.js +33 -0
  72. package/dist/Editor/common/DnD/DragHandleButton.js +56 -47
  73. package/dist/Editor/common/Icon.js +41 -8
  74. package/dist/Editor/common/LinkSettings/NavComponents.js +5 -2
  75. package/dist/Editor/common/LinkSettings/index.js +4 -2
  76. package/dist/Editor/common/LinkSettings/navOptions.js +7 -2
  77. package/dist/Editor/common/LinkSettings/style.js +11 -8
  78. package/dist/Editor/common/MentionsPopup/MentionsListCard.js +6 -1
  79. package/dist/Editor/common/MentionsPopup/index.js +8 -12
  80. package/dist/Editor/common/Section/index.js +69 -28
  81. package/dist/Editor/common/Section/styles.js +12 -6
  82. package/dist/Editor/common/Shorthands/elements.js +54 -12
  83. package/dist/Editor/common/StyleBuilder/buttonStyle.js +4 -2
  84. package/dist/Editor/common/StyleBuilder/fieldTypes/bannerSpacing.js +19 -16
  85. package/dist/Editor/common/StyleBuilder/fieldTypes/borderRadius.js +15 -7
  86. package/dist/Editor/common/StyleBuilder/fieldTypes/buttonLink.js +1 -1
  87. package/dist/Editor/common/StyleBuilder/fieldTypes/color.js +31 -7
  88. package/dist/Editor/common/StyleBuilder/fieldTypes/fontSize.js +13 -4
  89. package/dist/Editor/common/StyleBuilder/fieldTypes/selectBox.js +14 -3
  90. package/dist/Editor/common/StyleBuilder/fieldTypes/text.js +2 -4
  91. package/dist/Editor/common/StyleBuilder/fieldTypes/textOptions.js +14 -4
  92. package/dist/Editor/common/StyleBuilder/index.js +1 -1
  93. package/dist/Editor/common/StyleBuilder/sectionStyle.js +2 -13
  94. package/dist/Editor/common/iconslist.js +0 -31
  95. package/dist/Editor/helper/index.js +0 -139
  96. package/dist/Editor/helper/theme.js +185 -48
  97. package/dist/Editor/hooks/useEditorTheme.js +139 -0
  98. package/dist/Editor/hooks/useMouseMove.js +12 -37
  99. package/dist/Editor/hooks/useWindowMessage.js +10 -7
  100. package/dist/Editor/hooks/withCommon.js +1 -2
  101. package/dist/Editor/plugins/withEmbeds.js +1 -1
  102. package/dist/Editor/plugins/withHTML.js +1 -1
  103. package/dist/Editor/plugins/withTable.js +1 -1
  104. package/dist/Editor/theme/ThemeList.js +50 -173
  105. package/dist/Editor/theme/index.js +144 -0
  106. package/dist/Editor/themeSettings/ActiveTheme.js +72 -0
  107. package/dist/Editor/themeSettings/buttons/index.js +290 -0
  108. package/dist/Editor/themeSettings/buttons/style.js +21 -0
  109. package/dist/Editor/themeSettings/colorTheme/index.js +290 -0
  110. package/dist/Editor/themeSettings/colorTheme/style.js +77 -0
  111. package/dist/Editor/themeSettings/fonts/PreviewElement.js +123 -0
  112. package/dist/Editor/themeSettings/fonts/index.js +213 -0
  113. package/dist/Editor/themeSettings/fonts/style.js +44 -0
  114. package/dist/Editor/themeSettings/icons.js +60 -0
  115. package/dist/Editor/themeSettings/index.js +320 -0
  116. package/dist/Editor/themeSettings/style.js +152 -0
  117. package/dist/Editor/themeSettingsAI/icons.js +96 -0
  118. package/dist/Editor/themeSettingsAI/index.js +356 -0
  119. package/dist/Editor/themeSettingsAI/saveTheme.js +190 -0
  120. package/dist/Editor/themeSettingsAI/style.js +247 -0
  121. package/dist/Editor/utils/SlateUtilityFunctions.js +163 -47
  122. package/dist/Editor/utils/button.js +1 -17
  123. package/dist/Editor/utils/draftToSlate.js +1 -1
  124. package/dist/Editor/utils/events.js +54 -7
  125. package/dist/Editor/utils/font.js +40 -37
  126. package/dist/Editor/utils/helper.js +31 -31
  127. package/dist/Editor/utils/table.js +51 -43
  128. package/package.json +4 -6
  129. package/dist/Editor/Elements/FreeGrid/FreeGrid.js +0 -391
  130. package/dist/Editor/Elements/FreeGrid/FreeGridBox.js +0 -193
  131. package/dist/Editor/Elements/FreeGrid/FreeGridButton.js +0 -23
  132. package/dist/Editor/Elements/FreeGrid/FreeGridItem.js +0 -184
  133. package/dist/Editor/Elements/FreeGrid/Options/AddElement.js +0 -36
  134. package/dist/Editor/Elements/FreeGrid/Options/More.js +0 -24
  135. package/dist/Editor/Elements/FreeGrid/Options/SectionSettings.js +0 -47
  136. package/dist/Editor/Elements/FreeGrid/Options/sectionItemOptions.js +0 -11
  137. package/dist/Editor/Elements/FreeGrid/breakpointConstants.js +0 -75
  138. package/dist/Editor/Elements/FreeGrid/styles.js +0 -159
  139. package/dist/Editor/ErrorBoundary.js +0 -30
  140. package/dist/Editor/common/RnD/ContextMenu/CMenus.js +0 -105
  141. package/dist/Editor/common/RnD/ContextMenu/index.js +0 -38
  142. package/dist/Editor/common/RnD/ContextMenu/styles.js +0 -21
  143. package/dist/Editor/common/RnD/DragInfo/index.js +0 -31
  144. package/dist/Editor/common/RnD/DragInfo/styles.js +0 -15
  145. package/dist/Editor/common/RnD/DragOver/index.js +0 -46
  146. package/dist/Editor/common/RnD/DragOver/styles.js +0 -23
  147. package/dist/Editor/common/RnD/ElementOptions/Actions.js +0 -82
  148. package/dist/Editor/common/RnD/ElementOptions/Icons/LinkIcon.js +0 -26
  149. package/dist/Editor/common/RnD/ElementOptions/index.js +0 -93
  150. package/dist/Editor/common/RnD/ElementOptions/styles.js +0 -41
  151. package/dist/Editor/common/RnD/ElementSettings/OtherSettings/Link.js +0 -153
  152. package/dist/Editor/common/RnD/ElementSettings/OtherSettings/Settings.js +0 -58
  153. package/dist/Editor/common/RnD/ElementSettings/OtherSettings/index.js +0 -7
  154. package/dist/Editor/common/RnD/ElementSettings/Settings/BoxSettings.js +0 -46
  155. package/dist/Editor/common/RnD/ElementSettings/Settings/ButtonSettings.js +0 -46
  156. package/dist/Editor/common/RnD/ElementSettings/Settings/ImageSettings.js +0 -46
  157. package/dist/Editor/common/RnD/ElementSettings/Settings/TextSettings.js +0 -30
  158. package/dist/Editor/common/RnD/ElementSettings/Settings/VideoSettings.js +0 -46
  159. package/dist/Editor/common/RnD/ElementSettings/Settings/index.js +0 -13
  160. package/dist/Editor/common/RnD/ElementSettings/index.js +0 -17
  161. package/dist/Editor/common/RnD/ElementSettings/settingsConstants.js +0 -14
  162. package/dist/Editor/common/RnD/ElementSettings/styles.js +0 -76
  163. package/dist/Editor/common/RnD/GuideLines/BoundaryLine.js +0 -52
  164. package/dist/Editor/common/RnD/GuideLines/index.js +0 -33
  165. package/dist/Editor/common/RnD/GuideLines/styles.js +0 -60
  166. package/dist/Editor/common/RnD/OptionsPopup/index.js +0 -50
  167. package/dist/Editor/common/RnD/OptionsPopup/style.js +0 -36
  168. package/dist/Editor/common/RnD/RnDCopy.js +0 -23
  169. package/dist/Editor/common/RnD/ShadowElement.js +0 -34
  170. package/dist/Editor/common/RnD/SwitchViewport/SwitchViewport.js +0 -40
  171. package/dist/Editor/common/RnD/SwitchViewport/styles.js +0 -24
  172. package/dist/Editor/common/RnD/Theme/ViewportStimulator.js +0 -63
  173. package/dist/Editor/common/RnD/TransformHandles/CornerHandle.js +0 -19
  174. package/dist/Editor/common/RnD/TransformHandles/Icons/BottomRightIcon.js +0 -13
  175. package/dist/Editor/common/RnD/TransformHandles/SizeHandle.js +0 -18
  176. package/dist/Editor/common/RnD/TransformHandles/index.js +0 -62
  177. package/dist/Editor/common/RnD/Utils/alignmentDetection.js +0 -26
  178. package/dist/Editor/common/RnD/Utils/calculateDropItem.js +0 -98
  179. package/dist/Editor/common/RnD/Utils/collisionDetection.js +0 -52
  180. package/dist/Editor/common/RnD/Utils/gridDropItem.js +0 -148
  181. package/dist/Editor/common/RnD/Utils/index.js +0 -251
  182. package/dist/Editor/common/RnD/VirtualElement/index.js +0 -76
  183. package/dist/Editor/common/RnD/VirtualElement/styles.js +0 -27
  184. package/dist/Editor/common/RnD/VirtualElement/updateAutoProps.js +0 -28
  185. package/dist/Editor/common/RnD/index.js +0 -503
  186. package/dist/Editor/common/RnD/styles.js +0 -4
  187. package/dist/Editor/common/StyleBuilder/boxStyle.js +0 -30
  188. package/dist/Editor/helper/RnD/focusOnNewItem.js +0 -39
  189. package/dist/Editor/helper/RnD/scrollToNewSection.js +0 -24
  190. package/dist/Editor/helper/breakpoint.js +0 -5
  191. package/dist/Editor/hooks/useBreakpoints.js +0 -34
  192. package/dist/Editor/hooks/withErrorHandling.js +0 -14
  193. package/dist/Editor/utils/RnD/RnDCtrlCmds.js +0 -168
  194. package/dist/Editor/utils/freegrid.js +0 -49
@@ -1,391 +0,0 @@
1
- import React from "react";
2
- import { Path, Transforms, Node } from "slate";
3
- import { ReactEditor, useSlateStatic } from "slate-react";
4
- import { Box, useTheme } from "@mui/material";
5
- import RnD from "../../common/RnD";
6
- import More from "./Options/More";
7
- import { ROW_HEIGHT } from "../../common/RnD/Utils/gridDropItem";
8
- import AddElement from "./Options/AddElement";
9
- import useBreakpoints from "../../hooks/useBreakpoints";
10
- import { breakpointValues } from "./breakpointConstants";
11
- import useFreeGridStyles from "./styles";
12
- import { insertFreeGrid, insertFreeGridItem } from "../../utils/freegrid";
13
- import { useEditorContext } from "../../hooks/useMouseMove";
14
- import SectionSettings from "./Options/SectionSettings";
15
- import scrollToNewSection from "../../helper/RnD/scrollToNewSection";
16
- import { createEmbedNode } from "../../utils/embed";
17
- import { onPasteRnDNode } from "../../helper";
18
- import focusOnNewItem from "../../helper/RnD/focusOnNewItem";
19
- import { jsx as _jsx } from "react/jsx-runtime";
20
- import { jsxs as _jsxs } from "react/jsx-runtime";
21
- const MAX_DEVICE_WIDTH = {
22
- lg: 980,
23
- xs: 320
24
- };
25
- const FreeGrid = props => {
26
- const theme = useTheme();
27
- const breakpoint = useBreakpoints(theme);
28
- const classes = useFreeGridStyles({
29
- theme,
30
- MAX_DEVICE_WIDTH: MAX_DEVICE_WIDTH[breakpoint]
31
- });
32
- const editor = useSlateStatic();
33
- const {
34
- element,
35
- attributes,
36
- children,
37
- customProps
38
- } = props;
39
- const {
40
- sectionName
41
- } = element;
42
- const {
43
- readOnly
44
- } = customProps;
45
- const {
46
- updated_at,
47
- sectionBgColor,
48
- sectionBackgroundImage
49
- } = element;
50
- const path = ReactEditor.findPath(editor, element);
51
- // get values based on breakpoint size
52
- const {
53
- height
54
- } = breakpointValues(element.type, breakpoint, element);
55
- const {
56
- setSelectedElement
57
- } = useEditorContext();
58
- const onChange = data => {
59
- const append = breakpoint === "lg" ? "" : `_${breakpoint}`;
60
- const updateData = {
61
- ...data,
62
- [`height${append}`]: height + data.height
63
- };
64
- if (append !== "") {
65
- delete updateData.height;
66
- }
67
- if (breakpoint === "xs") {
68
- updateData.xs_updatedOn = new Date().getTime();
69
- }
70
- delete updateData.children;
71
- Transforms.setNodes(editor, {
72
- ...updateData
73
- }, {
74
- at: path
75
- });
76
- };
77
- const moveUp = () => {
78
- const cur_root_path = Path.parent(path);
79
- if (Path.hasPrevious(cur_root_path)) {
80
- Transforms.moveNodes(editor, {
81
- at: cur_root_path,
82
- to: Path.previous(cur_root_path)
83
- });
84
- }
85
- };
86
- const moveDown = () => {
87
- const cur_root_path = Path.parent(path);
88
- Transforms.moveNodes(editor, {
89
- at: cur_root_path,
90
- to: Path.next(cur_root_path)
91
- });
92
- };
93
- const handleActionClick = actionType => {
94
- switch (actionType) {
95
- case "moveUp":
96
- moveUp();
97
- break;
98
- case "moveDown":
99
- moveDown();
100
- break;
101
- default:
102
- }
103
- };
104
- const handleMoreClick = moreAction => () => {
105
- try {
106
- const cur_root_path = Path.parent(path);
107
- const next_path = Path.next(cur_root_path);
108
- switch (moreAction) {
109
- case "addSection":
110
- insertFreeGrid(editor, next_path, {
111
- setSelectedElement
112
- });
113
- break;
114
- case "duplicateSection":
115
- Transforms.insertNodes(editor, [{
116
- ...JSON.parse(JSON.stringify(Node.get(editor, cur_root_path)))
117
- }], {
118
- at: next_path
119
- });
120
- scrollToNewSection(editor, next_path, {
121
- setSelectedElement
122
- });
123
- break;
124
- default:
125
- }
126
- } catch (err) {
127
- console.log(err);
128
- }
129
- };
130
- const isEmptySection = () => {
131
- try {
132
- const emptyNode = element?.children?.find(f => !f.type) && element?.children.length === 1;
133
- return emptyNode;
134
- } catch (err) {
135
- console.log(err);
136
- }
137
- };
138
- const handleAddElementClick = type => () => {
139
- const isEmpty = isEmptySection();
140
- const insertAt = isEmpty ? [...path, 0] : [...path, element?.children?.length];
141
- switch (type) {
142
- case "addText":
143
- Transforms.insertNodes(editor, [{
144
- type: "freegridItem",
145
- childType: "text",
146
- children: [{
147
- type: "paragraph",
148
- children: [{
149
- text: "Text"
150
- }]
151
- }],
152
- gridArea: "3 / 1 / 4 / 2",
153
- left: 50,
154
- marginTop: 0,
155
- top: 0,
156
- width: 170,
157
- height: 80
158
- }], {
159
- at: [...insertAt]
160
- });
161
- break;
162
- case "addButton":
163
- Transforms.insertNodes(editor, [{
164
- type: "freegridItem",
165
- childType: "button",
166
- children: [{
167
- type: "button",
168
- children: [{
169
- text: ""
170
- }],
171
- buttonLink: {
172
- linkType: "webAddress"
173
- },
174
- iconPosition: "start",
175
- bgColor: "#2563EB",
176
- textColor: "#FFF",
177
- borderRadius: {
178
- topLeft: 30,
179
- topRight: 30,
180
- bottomLeft: 30,
181
- bottomRight: 30
182
- },
183
- bannerSpacing: {
184
- left: 12,
185
- top: 12,
186
- right: 12,
187
- bottom: 12
188
- }
189
- }],
190
- gridArea: "3 / 1 / 4 / 2",
191
- left: 50,
192
- marginTop: 0,
193
- top: 0,
194
- width: 170,
195
- height: 80
196
- }], {
197
- at: [...insertAt]
198
- });
199
- break;
200
- case "addImage":
201
- Transforms.insertNodes(editor, [{
202
- type: "freegridItem",
203
- childType: "image",
204
- children: [{
205
- type: "image",
206
- url: "",
207
- images: [],
208
- children: [{
209
- text: ""
210
- }]
211
- }],
212
- gridArea: "3 / 1 / 4 / 2",
213
- left: 50,
214
- marginTop: 0,
215
- top: 0,
216
- width: 170,
217
- height: 80
218
- }], {
219
- at: [...insertAt]
220
- });
221
- break;
222
- case "addVideo":
223
- Transforms.insertNodes(editor, [{
224
- ...insertFreeGridItem("video", createEmbedNode("video", {
225
- url: "",
226
- alt: "",
227
- images: []
228
- }), {
229
- height: 300,
230
- width: 250
231
- })
232
- }], {
233
- at: [...insertAt]
234
- });
235
- break;
236
- case "addBox":
237
- Transforms.insertNodes(editor, [{
238
- ...insertFreeGridItem("box", {
239
- type: "paragraph",
240
- children: [{
241
- text: ""
242
- }]
243
- }, {}, "freegridBox")
244
- }], {
245
- at: [...insertAt]
246
- });
247
- break;
248
- default:
249
- }
250
- // focus on newly added element
251
- focusOnNewItem(editor, insertAt, {
252
- setSelectedElement
253
- });
254
- };
255
- const onPaste = () => {
256
- try {
257
- const cur_root_path = Path.parent(path);
258
- const parsed_node = JSON.parse(window.copiedNode);
259
- if (parsed_node?.type === "freegridItem" || parsed_node?.type === "freegridBox") {
260
- const np = onPasteRnDNode(editor, {
261
- path,
262
- children: children
263
- });
264
- if (np) {
265
- focusOnNewItem(editor, np, {
266
- setSelectedElement
267
- });
268
- }
269
- } else {
270
- // for pasting whole section
271
- const new_path = Path.next(cur_root_path);
272
- Transforms.insertNodes(editor, [{
273
- ...parsed_node
274
- }], {
275
- at: new_path
276
- });
277
- scrollToNewSection(editor, new_path, {
278
- setSelectedElement
279
- });
280
- }
281
- } catch (err) {
282
- console.log(err);
283
- }
284
- };
285
- const onDelete = () => {
286
- try {
287
- Transforms.removeNodes(editor, {
288
- at: Path.parent(path)
289
- });
290
- } catch (err) {
291
- console.log(err);
292
- }
293
- };
294
- const handleContextMenuClick = d => {
295
- switch (d?.name) {
296
- case "cut":
297
- window.copiedNode = JSON.stringify(Node.get(editor, Path.parent(path)));
298
- onDelete();
299
- break;
300
- case "copy":
301
- window.copiedNode = JSON.stringify(Node.get(editor, Path.parent(path)));
302
- break;
303
- case "paste":
304
- onPaste();
305
- break;
306
- case "delete":
307
- onDelete();
308
- break;
309
- default:
310
- return;
311
- }
312
- };
313
- const repeatTimes = Math.floor(height / ROW_HEIGHT);
314
- return /*#__PURE__*/_jsx(RnD, {
315
- id: `freegrid_container_${path.join("|")}_${updated_at}_${breakpoint}`,
316
- className: `freegrid-section breakpoint-${breakpoint}`,
317
- editor: editor,
318
- path: path,
319
- disableDragging: true,
320
- style: {
321
- position: "relative",
322
- "--height": `${height}px`
323
- },
324
- defaultStyle: {
325
- width: "100%",
326
- height: height ? `${height}px` : "auto"
327
- },
328
- enableResizing: {
329
- bottom: true
330
- },
331
- actions: ["addElement", "settings", "moveUp", "moveDown", "more"],
332
- type: "parent",
333
- optionsProps: {
334
- placement: "right",
335
- sx: classes.sectionPopper
336
- },
337
- onChange: onChange,
338
- handleActionClick: handleActionClick,
339
- actionsMap: {
340
- addElement: {
341
- Component: AddElement,
342
- placement: "left",
343
- title: "Add Element",
344
- props: {
345
- handleClick: handleAddElementClick
346
- }
347
- },
348
- more: {
349
- Component: More,
350
- placement: "left",
351
- title: "More Options",
352
- props: {
353
- handleClick: handleMoreClick
354
- }
355
- },
356
- settings: {
357
- Component: SectionSettings,
358
- placement: "left",
359
- title: "Section Settings",
360
- props: {
361
- editor,
362
- path,
363
- classes
364
- }
365
- }
366
- },
367
- readOnly: readOnly,
368
- updated_at: updated_at,
369
- breakpoint: breakpoint,
370
- handleContextMenuClick: handleContextMenuClick,
371
- children: /*#__PURE__*/_jsxs(Box, {
372
- ...attributes,
373
- className: "freegrid-container",
374
- sx: classes.root,
375
- "data-path": path.join("|"),
376
- style: {
377
- "--cols": `100%`,
378
- "--rows": `repeat(${repeatTimes}, ${ROW_HEIGHT}px)`,
379
- background: sectionBgColor,
380
- backgroundImage: `url('${sectionBackgroundImage}')`,
381
- backgroundSize: "cover"
382
- },
383
- children: [children, !readOnly ? /*#__PURE__*/_jsx("span", {
384
- placeholder: `Section (${sectionName || "Welcome"})`,
385
- className: "freegrid-section-infos",
386
- contentEditable: false
387
- }) : null]
388
- })
389
- });
390
- };
391
- export default FreeGrid;
@@ -1,193 +0,0 @@
1
- import React from "react";
2
- import { Transforms, Node, Path } from "slate";
3
- import { useSlateStatic } from "slate-react";
4
- import { ReactEditor } from "slate-react";
5
- import { Box, useTheme } from "@mui/material";
6
- import RnD from "../../common/RnD";
7
- import { onDropItem } from "../../common/RnD/Utils/gridDropItem";
8
- import useBreakpoints from "../../hooks/useBreakpoints";
9
- import { breakpointValues, formatBreakpointValues } from "./breakpointConstants";
10
- import { useEditorContext } from "../../hooks/useMouseMove";
11
- import { getBreakPointsValue } from "../../helper/theme";
12
- import focusOnNewItem from "../../helper/RnD/focusOnNewItem";
13
- import { bringItemToFB } from "../../helper";
14
- import { jsx as _jsx } from "react/jsx-runtime";
15
- const FreeGridBox = props => {
16
- const theme = useTheme();
17
- const breakpoint = useBreakpoints(theme);
18
- const {
19
- element,
20
- attributes,
21
- children,
22
- customProps
23
- } = props;
24
- const editor = useSlateStatic();
25
- const path = ReactEditor.findPath(editor, element);
26
- const {
27
- readOnly
28
- } = customProps;
29
- const {
30
- updated_at,
31
- zIndex,
32
- sectionBgColor,
33
- sectionBackgroundImage,
34
- sectionBorderRadius
35
- } = element;
36
- // get values based on breakpoint size
37
- const {
38
- gridArea,
39
- width,
40
- height,
41
- left,
42
- top,
43
- marginTop
44
- } = breakpointValues(element.type, breakpoint, element);
45
- const {
46
- setSelectedElement
47
- } = useEditorContext();
48
- const arrangeIndex = zIndex === undefined ? path[path.length - 1] : zIndex;
49
- const onChangeSettings = () => {};
50
- const onChange = data => {
51
- let updateData = {
52
- ...data
53
- };
54
- delete updateData.children;
55
- updateData = formatBreakpointValues(element.type, breakpoint, updateData);
56
- Transforms.setNodes(editor, {
57
- ...updateData
58
- }, {
59
- at: path
60
- });
61
- };
62
- const handleDragEvent = (type, data, cb) => {
63
- const toPosition = {
64
- left: left + data.lastX,
65
- top: top + data.lastY
66
- };
67
- const {
68
- node,
69
- ...rest
70
- } = data;
71
- switch (type) {
72
- case "stop":
73
- const updated_data = onDropItem({
74
- editor,
75
- fromPosition: {
76
- left,
77
- top
78
- },
79
- toPosition,
80
- path,
81
- ref: node,
82
- breakpoint,
83
- ...rest
84
- }, ".freegrid-container");
85
- if (cb) {
86
- cb(updated_data);
87
- }
88
- break;
89
- default:
90
- }
91
- };
92
- const handleResizeEvent = (type, data, cb) => {
93
- switch (type) {
94
- case "stop":
95
- return;
96
- default:
97
- }
98
- };
99
- const onDelete = () => {
100
- try {
101
- Transforms.removeNodes(editor, {
102
- at: path
103
- });
104
- } catch (err) {
105
- console.log(err);
106
- }
107
- };
108
- const handleContextMenuClick = d => {
109
- switch (d?.name) {
110
- case "bringForward":
111
- bringItemToFB(editor, {
112
- path,
113
- moveFront: true
114
- });
115
- Transforms.setNodes(editor, {
116
- zIndex: Math.min(arrangeIndex + 1, editor.children.length)
117
- }, {
118
- at: path
119
- });
120
- break;
121
- case "bringBackward":
122
- bringItemToFB(editor, {
123
- path,
124
- moveFront: false
125
- });
126
- break;
127
- case "cut":
128
- window.copiedNode = JSON.stringify(Node.get(editor, path));
129
- onDelete();
130
- focusOnNewItem(editor, Path.parent(path), {
131
- setSelectedElement
132
- });
133
- break;
134
- case "copy":
135
- window.copiedNode = JSON.stringify(Node.get(editor, path));
136
- break;
137
- case "delete":
138
- onDelete();
139
- setSelectedElement({});
140
- break;
141
- default:
142
- return;
143
- }
144
- };
145
- return /*#__PURE__*/_jsx(RnD, {
146
- id: `freegrid_box_item_${path.join("|")}_${updated_at}_${breakpoint}`,
147
- className: `freegrid-item breakpoint-${breakpoint}`,
148
- editor: editor,
149
- path: path,
150
- actions: ["ai", "drag", "settings", "close"],
151
- settingsProps: {
152
- settings: "freegridBoxItem",
153
- onChange: onChangeSettings
154
- },
155
- style: {
156
- "--left": `${left || 0}px`,
157
- "--marginTop": `${marginTop || 0}px`,
158
- "--gridArea": `${gridArea}`,
159
- "--width": `${width}px`,
160
- "--height": `${height}px`,
161
- "--zIndex": 100 + arrangeIndex
162
- },
163
- defaultStyle: {
164
- height: `${height}px`,
165
- width: `${width}px`
166
- },
167
- gridArea: gridArea,
168
- onChange: onChange,
169
- delta: {
170
- width,
171
- height
172
- },
173
- handleDragEvent: handleDragEvent,
174
- handleResizeEvent: handleResizeEvent,
175
- readOnly: readOnly,
176
- childType: "box",
177
- handleContextMenuClick: handleContextMenuClick,
178
- children: /*#__PURE__*/_jsx(Box, {
179
- component: "div",
180
- ...attributes,
181
- className: `fgi_type_box`,
182
- sx: {
183
- borderRadius: {
184
- ...getBreakPointsValue(sectionBorderRadius || {}, null, "overrideBorderRadius", true)
185
- },
186
- background: sectionBgColor,
187
- backgroundImage: `url(${sectionBackgroundImage})`
188
- },
189
- children: children
190
- })
191
- });
192
- };
193
- export default FreeGridBox;
@@ -1,23 +0,0 @@
1
- import React from "react";
2
- import ToolbarIcon from "../../common/ToolbarIcon";
3
- import Icon from "../../common/Icon";
4
- import { insertFreeGrid } from "../../utils/freegrid";
5
- import { jsx as _jsx } from "react/jsx-runtime";
6
- const FreeGridButton = props => {
7
- const {
8
- editor,
9
- icoBtnType
10
- } = props;
11
- const onButtonClick = () => {
12
- insertFreeGrid(editor);
13
- };
14
- return /*#__PURE__*/_jsx(ToolbarIcon, {
15
- title: "Free Grid",
16
- onClick: onButtonClick,
17
- icon: /*#__PURE__*/_jsx(Icon, {
18
- icon: "freegrid"
19
- }),
20
- icoBtnType: icoBtnType
21
- });
22
- };
23
- export default FreeGridButton;