@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,63 +0,0 @@
1
- import React from "react";
2
- import { useTheme, ThemeProvider, createTheme } from "@mui/material";
3
- import { isStimulator, STIMULATOR_MOCK } from "../../../hooks/useBreakpoints";
4
-
5
- // Custom breakpoints functions
6
- import { jsx as _jsx } from "react/jsx-runtime";
7
- const customUp = (key, breakpoints) => {
8
- const MOCK_BREAKPOINT = isStimulator();
9
- if (key === "xs") {
10
- // Simulate xs 'up' as being up from 0px (xs)
11
- return "@media (min-width: 0px)";
12
- }
13
- if (MOCK_BREAKPOINT && key === "lg") {
14
- return `@media (min-width: 10000px)`;
15
- }
16
- return `@media (min-width: ${breakpoints[key]}px)`;
17
- };
18
- const customDown = (key, breakpoints) => {
19
- if (key === "md") {
20
- // Simulate 'down' from md
21
- return "@media (max-width: 960px)";
22
- }
23
- return `@media (max-width: ${breakpoints[key]}px)`;
24
- };
25
- const customBetween = (start, end, breakpoints) => {
26
- // Custom logic for between, simulating xs for demonstration
27
- const MOCK_BREAKPOINT = isStimulator();
28
- if (MOCK_BREAKPOINT && start === "xs" && end === "md") {
29
- return STIMULATOR_MOCK[MOCK_BREAKPOINT];
30
- }
31
- return `@media (min-width: ${breakpoints[start]}px) and (max-width: ${breakpoints[end]}px)`;
32
- };
33
- const customOnly = (key, breakpoints) => {
34
- // Custom logic for between, simulating xs for demonstration
35
- const MOCK_BREAKPOINT = isStimulator();
36
- if (MOCK_BREAKPOINT && key === "xs") {
37
- return STIMULATOR_MOCK[MOCK_BREAKPOINT];
38
- }
39
- return `@media (min-width: ${breakpoints[key]}px) and (max-width: ${breakpoints[key + 1]}px)`;
40
- };
41
-
42
- // Extend the existing theme with custom breakpoint functions
43
- const extendedTheme = prevTheme => createTheme({
44
- ...prevTheme,
45
- breakpoints: {
46
- ...prevTheme.breakpoints,
47
- up: key => customUp(key, prevTheme.breakpoints.values),
48
- down: key => customDown(key, prevTheme.breakpoints.values),
49
- between: (start, end) => customBetween(start, end, prevTheme.breakpoints.values),
50
- only: key => customOnly(key, prevTheme.breakpoints.values)
51
- }
52
- });
53
- const ViewportStimulator = ({
54
- children
55
- }) => {
56
- const theme = useTheme();
57
- const viewportTheme = extendedTheme(theme);
58
- return /*#__PURE__*/_jsx(ThemeProvider, {
59
- theme: viewportTheme,
60
- children: children
61
- });
62
- };
63
- export default ViewportStimulator;
@@ -1,19 +0,0 @@
1
- import React from "react";
2
- import { jsx as _jsx } from "react/jsx-runtime";
3
- const CornerHandle = ({
4
- style
5
- }) => {
6
- return /*#__PURE__*/_jsx("div", {
7
- style: {
8
- width: "8px",
9
- height: "8px",
10
- background: "#FFF",
11
- border: "1px solid #2563EB",
12
- position: "absolute",
13
- left: "6px",
14
- top: "6px",
15
- ...style
16
- }
17
- });
18
- };
19
- export default CornerHandle;
@@ -1,13 +0,0 @@
1
- import React from "react";
2
- import { jsx as _jsx } from "react/jsx-runtime";
3
- const BottomRightIcon = () => /*#__PURE__*/_jsx("svg", {
4
- width: "20px",
5
- height: "20px",
6
- version: "1.1",
7
- viewBox: "0 0 100 100",
8
- xmlns: "http://www.w3.org/2000/svg",
9
- children: /*#__PURE__*/_jsx("path", {
10
- d: "m70.129 67.086l1.75-36.367c-0.035156-2.6523-2.9414-3.6523-4.8164-1.7773l-8.4531 8.4531-17.578-17.574c-2.3438-2.3438-5.7188-1.5625-8.0586 0.78125l-13.078 13.078c-2.3438 2.3438-2.4141 5.0117-0.074219 7.3516l17.574 17.574-8.4531 8.4531c-1.875 1.875-0.83594 4.8203 1.8164 4.8555l36.258-1.8594c1.6836 0.019531 3.1328-1.2812 3.1133-2.9688z"
11
- })
12
- });
13
- export default BottomRightIcon;
@@ -1,18 +0,0 @@
1
- import React from "react";
2
- import { jsx as _jsx } from "react/jsx-runtime";
3
- const SizeHandle = ({
4
- style
5
- }) => {
6
- return /*#__PURE__*/_jsx("div", {
7
- style: {
8
- width: "8px",
9
- height: "8px",
10
- background: "#FFF",
11
- border: "1px solid #2563EB",
12
- position: "absolute",
13
- margin: "auto",
14
- ...style
15
- }
16
- });
17
- };
18
- export default SizeHandle;
@@ -1,62 +0,0 @@
1
- import CornerHandle from "./CornerHandle";
2
- import SizeHandle from "./SizeHandle";
3
- import { jsx as _jsx } from "react/jsx-runtime";
4
- const Handles = {
5
- top: /*#__PURE__*/_jsx(SizeHandle, {
6
- style: {
7
- left: 0,
8
- right: 0
9
- }
10
- }),
11
- bottom: /*#__PURE__*/_jsx(SizeHandle, {
12
- style: {
13
- left: 0,
14
- right: 0,
15
- bottom: 0
16
- }
17
- }),
18
- right: /*#__PURE__*/_jsx(SizeHandle, {
19
- style: {
20
- top: 0,
21
- right: "0px",
22
- bottom: 0,
23
- width: "8px",
24
- height: "8px"
25
- }
26
- }),
27
- left: /*#__PURE__*/_jsx(SizeHandle, {
28
- style: {
29
- top: 0,
30
- left: "0px",
31
- bottom: 0,
32
- width: "8px",
33
- height: "8px"
34
- }
35
- }),
36
- topLeft: /*#__PURE__*/_jsx(CornerHandle, {
37
- style: {
38
- left: "6px",
39
- top: "6px",
40
- display: "none"
41
- }
42
- }),
43
- topRight: /*#__PURE__*/_jsx(CornerHandle, {
44
- style: {
45
- right: "6px",
46
- top: "6px"
47
- }
48
- }),
49
- bottomLeft: /*#__PURE__*/_jsx(CornerHandle, {
50
- style: {
51
- left: "6px",
52
- top: "6px"
53
- }
54
- }),
55
- bottomRight: /*#__PURE__*/_jsx(CornerHandle, {
56
- style: {
57
- left: "6px",
58
- top: "6px"
59
- }
60
- })
61
- };
62
- export default Handles;
@@ -1,26 +0,0 @@
1
- function horizantalAlignment(rect1, rect2) {
2
- const diff = Math.abs(rect2.top - rect1.bottom);
3
- return {
4
- horizantal: rect2.top < rect1.bottom,
5
- hdiff: diff,
6
- hpercent: diff / rect2.height * 100
7
- };
8
- }
9
- function verticalAlignment(rect1, rect2) {
10
- const diff = Math.abs(rect1.right - rect2.left);
11
- return {
12
- vertical: rect2.left > rect1.left && rect2.left < rect1.right,
13
- vdiff: diff,
14
- vpercent: diff / rect2.width * 100
15
- };
16
- }
17
- export function alignmentDetection(rect1, rect2) {
18
- try {
19
- return {
20
- ...horizantalAlignment(rect1, rect2),
21
- ...verticalAlignment(rect1, rect2)
22
- };
23
- } catch (err) {
24
- console.log(err);
25
- }
26
- }
@@ -1,98 +0,0 @@
1
- import { Transforms, Node } from "slate";
2
- import { ReactEditor } from "slate-react";
3
- import { alignmentDetection } from "./alignmentDetection";
4
-
5
- /**
6
- * This method will return the list of items inside the give section
7
- * @param {*} sectionPath - paresent section path to get items
8
- */
9
- export function getItems(editor, sectionPath = []) {
10
- try {
11
- const parentNode = Node.get(editor, sectionPath);
12
- let doms = parentNode?.children?.map((item, itemIndex) => {
13
- const itemDom = ReactEditor.toDOMNode(editor, item)?.closest(".freegrid-item");
14
- const {
15
- left,
16
- top,
17
- width,
18
- height,
19
- right,
20
- bottom
21
- } = itemDom?.getBoundingClientRect();
22
- return {
23
- node: itemDom,
24
- rect: {
25
- left,
26
- top,
27
- width,
28
- height,
29
- right,
30
- bottom
31
- },
32
- path: [...sectionPath, itemIndex],
33
- item
34
- };
35
- });
36
- // sort by top position
37
- doms = doms.sort((a, b) => a.rect.top - b.rect.top);
38
- return {
39
- items: parentNode?.children,
40
- doms
41
- };
42
- } catch (err) {
43
- console.log(err);
44
- }
45
- }
46
-
47
- /**
48
- * This method will get the nearest top element
49
- * @param {*} editor
50
- * @param {*} sectionPath
51
- * @param {*} props
52
- */
53
- export function getNearestItem(editor, sectionPath = [], props) {
54
- try {
55
- const {
56
- items,
57
- doms
58
- } = getItems(editor, sectionPath);
59
- console.log(items, doms);
60
- for (let i = 0; i < doms.length; i++) {
61
- const prev = doms[i - 1];
62
- const current = doms[i];
63
- if (i > 0) {
64
- const res = alignmentDetection(prev.rect, current.rect);
65
- console.log(res, current?.path);
66
- const {
67
- vertical,
68
- horizantal,
69
- hpercent
70
- } = res;
71
- if (!vertical && !horizantal) {
72
- const row = i + 1;
73
- Transforms.setNodes(editor, {
74
- gridArea: `${i + 1} / 1 / ${row + 1} / 2`,
75
- top: 0,
76
- marginTop: 0
77
- }, {
78
- at: current?.path
79
- });
80
- } else if (horizantal && hpercent > 5) {
81
- Transforms.setNodes(editor, {
82
- gridArea: `${i - 1 || 1} / 1 / ${(i - 1 || 1) + 1} / 2`
83
- }, {
84
- at: current?.path
85
- });
86
- }
87
- } else {
88
- Transforms.setNodes(editor, {
89
- gridArea: `1 / 1 / 2 / 2`
90
- }, {
91
- at: current?.path
92
- });
93
- }
94
- }
95
- } catch (err) {
96
- console.log(err);
97
- }
98
- }
@@ -1,52 +0,0 @@
1
- function isColliding(rect1, rect2) {
2
- return !(rect1.right < rect2.left || rect1.left > rect2.right || rect1.bottom < rect2.top || rect1.top > rect2.bottom);
3
- }
4
- function getCollisionSides(rect1, rect2) {
5
- const collisionSides = {
6
- top: rect1.top < rect2.bottom && rect1.bottom > rect2.top && rect1.left < rect2.right && rect1.right > rect2.left && rect1.top <= rect2.top,
7
- bottom: rect1.top < rect2.bottom && rect1.bottom > rect2.top && rect1.left < rect2.right && rect1.right > rect2.left && rect1.bottom >= rect2.bottom,
8
- left: rect1.top < rect2.bottom && rect1.bottom > rect2.top && rect1.left <= rect2.left && rect1.right > rect2.left,
9
- right: rect1.top < rect2.bottom && rect1.bottom > rect2.top && rect1.right >= rect2.right && rect1.left < rect2.right
10
- };
11
- return collisionSides;
12
- }
13
- function getCollisionDetails(rect1, rect2) {
14
- if (!isColliding(rect1, rect2)) {
15
- return null;
16
- }
17
- const overlapX = Math.min(rect1.right, rect2.right) - Math.max(rect1.left, rect2.left);
18
- const overlapY = Math.min(rect1.bottom, rect2.bottom) - Math.max(rect1.top, rect2.top);
19
- let collisionSide = "";
20
- let penetrationDepth = Math.min(overlapX, overlapY); // Basic depth calculation
21
-
22
- if (overlapX < overlapY) {
23
- collisionSide = rect1.left < rect2.left ? "right" : "left";
24
- penetrationDepth = overlapX;
25
- } else {
26
- collisionSide = rect1.top < rect2.top ? "bottom" : "top";
27
- penetrationDepth = overlapY;
28
- }
29
- return {
30
- collision: true,
31
- side: collisionSide,
32
- depth: penetrationDepth
33
- };
34
- }
35
- export function detectCollisionAndSides(rect1, rect2) {
36
- const isColliding = !(rect1.right < rect2.left || rect1.left > rect2.right || rect1.bottom < rect2.top || rect1.top > rect2.bottom);
37
- if (isColliding) {
38
- const sides = getCollisionSides(rect1, rect2);
39
- const collisionDetails = getCollisionDetails(rect1, rect2);
40
- return {
41
- isColliding,
42
- sides,
43
- collisionDetails
44
- };
45
- } else {
46
- return {
47
- isColliding,
48
- sides: {},
49
- collisionDetails: null
50
- };
51
- }
52
- }
@@ -1,148 +0,0 @@
1
- import { Transforms, Node } from "slate";
2
- import { ReactEditor } from "slate-react";
3
- export const ROW_HEIGHT = 50;
4
- const MARGIN_OF = {
5
- xs: 160,
6
- lg: 490
7
- };
8
-
9
- /**
10
- * This method will update the grid template rows of parent section based on height
11
- * @param {*} path
12
- */
13
- export function updateRows() {}
14
-
15
- /**
16
- * This method will update the grid template columns of parent section based on height
17
- * @param {*} path
18
- */
19
- export function updateCols() {}
20
- const handleMoveNode = (editor, path, newPath, {
21
- isEmpty
22
- }) => {
23
- try {
24
- const replaceNode = Node.get(editor, path);
25
- if (isEmpty) {
26
- const toPath = [...newPath, 0];
27
- Transforms.insertNodes(editor, [{
28
- ...replaceNode
29
- }], {
30
- at: toPath
31
- });
32
- Transforms.removeNodes(editor, {
33
- at: path
34
- });
35
- return toPath;
36
- } else {
37
- Transforms.insertNodes(editor, [{
38
- ...replaceNode
39
- }], {
40
- at: newPath
41
- });
42
- Transforms.removeNodes(editor, {
43
- at: path
44
- });
45
- return newPath;
46
- }
47
- } catch (err) {
48
- console.log(err);
49
- console.log("Drop Node error");
50
- return null;
51
- }
52
- };
53
-
54
- /**
55
- * This method will update prop in child node so it will re-render and update the path
56
- * @param {*} path - contains the parent section path
57
- */
58
- const reRenderChildNodes = (editor, path) => {
59
- try {
60
- const sectionNode = Node.get(editor, path);
61
- // parent node
62
- Transforms.setNodes(editor, {
63
- updated_at: new Date().getTime()
64
- }, {
65
- at: path
66
- });
67
- sectionNode?.children?.forEach((item, itemIndex) => {
68
- Transforms.setNodes(editor, {
69
- updated_at: new Date().getTime()
70
- }, {
71
- at: [...path, itemIndex]
72
- });
73
- });
74
- } catch (err) {
75
- console.log(err);
76
- }
77
- };
78
- export function onDropItem(props, parentClass) {
79
- try {
80
- const {
81
- editor,
82
- startPosition,
83
- endPosition,
84
- dragOver,
85
- parentPath,
86
- path,
87
- diffX,
88
- x: cx,
89
- breakpoint
90
- } = props;
91
- const posX = parseInt(cx - window.innerWidth / 2 + MARGIN_OF[breakpoint] - diffX);
92
- const needMove = dragOver !== parentPath;
93
- const moveTo = dragOver.split("|").map(m => parseInt(m));
94
- const from = parentPath.split("|").map(m => parseInt(m));
95
- let newPath = [];
96
- newPath = moveTo;
97
- const toSectionNode = Node.get(editor, newPath);
98
- const addToSectionDOM = ReactEditor.toDOMNode(editor, toSectionNode);
99
- const rect = addToSectionDOM.getBoundingClientRect();
100
- const y = endPosition.y - startPosition.diffY - rect.top;
101
-
102
- // Calculate grid position
103
- const row = Math.floor(y / ROW_HEIGHT) + 1;
104
-
105
- // to calculate difference inside the grid
106
- const marginTop = Math.abs((row - 1) * ROW_HEIGHT - y);
107
-
108
- // Update grid area
109
- const gridArea = `${row} / 1 / ${row + 1} / 2`;
110
- const appenBp = breakpoint === "lg" ? "" : `_${breakpoint}`;
111
- Transforms.setNodes(editor, {
112
- [`gridArea${appenBp}`]: gridArea,
113
- [`left${appenBp}`]: posX,
114
- [`marginTop${appenBp}`]: marginTop,
115
- // to avoid auto position / resize of the element
116
- [`${breakpoint}_updatedOn`]: new Date().getTime()
117
- }, {
118
- at: path
119
- });
120
- reRenderChildNodes(editor, from);
121
-
122
- // move the node if section parent changed
123
- if (needMove) {
124
- // move the node
125
- const isEmpty = toSectionNode?.children[0]?.type === undefined;
126
- if (!isEmpty) {
127
- newPath = [...newPath, toSectionNode?.children?.length];
128
- }
129
- const rPath = handleMoveNode(editor, path, newPath, {
130
- isEmpty
131
- });
132
- reRenderChildNodes(editor, moveTo);
133
- return {
134
- updated_at: rPath
135
- };
136
- } else {
137
- return {
138
- updated_at: path
139
- };
140
- }
141
- } catch (err) {
142
- console.log(err);
143
- }
144
- }
145
- export function calculateGridArea(y) {
146
- const row = Math.floor(y / ROW_HEIGHT) + 1;
147
- return `${row} / 1 / ${row + 1} / 2`;
148
- }