@flozy/editor 3.8.7 → 3.8.9

Sign up to get free protection for your applications and to get access to all the features.
Files changed (188) hide show
  1. package/dist/Editor/ChatEditor.js +2 -2
  2. package/dist/Editor/CommonEditor.js +170 -166
  3. package/dist/Editor/DialogWrapper.js +4 -3
  4. package/dist/Editor/Editor.css +4 -7
  5. package/dist/Editor/Elements/AI/AIInput.js +5 -16
  6. package/dist/Editor/Elements/AI/PopoverAIInput.js +64 -67
  7. package/dist/Editor/Elements/AI/Styles.js +1 -2
  8. package/dist/Editor/Elements/AppHeader/AppHeader.js +40 -49
  9. package/dist/Editor/Elements/Button/EditorButton.js +33 -38
  10. package/dist/Editor/Elements/Color Picker/ColorButtons.js +17 -60
  11. package/dist/Editor/Elements/Color Picker/ColorPicker.css +1 -25
  12. package/dist/Editor/Elements/Color Picker/ColorPicker.js +4 -4
  13. package/dist/Editor/Elements/Color Picker/Styles.js +1 -2
  14. package/dist/Editor/Elements/Embed/Image.js +15 -14
  15. package/dist/Editor/Elements/Embed/Video.js +12 -8
  16. package/dist/Editor/Elements/Emoji/EmojiButton.js +11 -7
  17. package/dist/Editor/Elements/Form/Workflow/FormWorkflow.js +3 -12
  18. package/dist/Editor/Elements/Form/Workflow/UserInputs.js +1 -2
  19. package/dist/Editor/Elements/FreeGrid/FreeGrid.js +391 -0
  20. package/dist/Editor/Elements/FreeGrid/FreeGridBox.js +193 -0
  21. package/dist/Editor/Elements/FreeGrid/FreeGridButton.js +23 -0
  22. package/dist/Editor/Elements/FreeGrid/FreeGridItem.js +184 -0
  23. package/dist/Editor/Elements/FreeGrid/Options/AddElement.js +36 -0
  24. package/dist/Editor/Elements/FreeGrid/Options/More.js +24 -0
  25. package/dist/Editor/Elements/FreeGrid/Options/SectionSettings.js +47 -0
  26. package/dist/Editor/Elements/FreeGrid/Options/sectionItemOptions.js +11 -0
  27. package/dist/Editor/Elements/FreeGrid/breakpointConstants.js +75 -0
  28. package/dist/Editor/Elements/FreeGrid/styles.js +159 -0
  29. package/dist/Editor/Elements/Grid/Grid.js +14 -34
  30. package/dist/Editor/Elements/Grid/GridItem.js +31 -23
  31. package/dist/Editor/Elements/Link/Link.js +1 -6
  32. package/dist/Editor/Elements/Link/LinkButton.js +2 -4
  33. package/dist/Editor/Elements/Link/LinkPopup.js +3 -10
  34. package/dist/Editor/Elements/PageSettings/PageSettingsButton.js +3 -3
  35. package/dist/Editor/Elements/Signature/SignaturePopup.js +3 -14
  36. package/dist/Editor/Elements/SimpleText/index.js +9 -8
  37. package/dist/Editor/Elements/SimpleText/style.js +37 -0
  38. package/dist/Editor/Elements/Table/Styles.js +1 -23
  39. package/dist/Editor/Elements/Table/Table.js +1 -2
  40. package/dist/Editor/Elements/Table/TableCell.js +7 -69
  41. package/dist/Editor/Elements/TableContextMenu/TableContextMenu.js +0 -1
  42. package/dist/Editor/ErrorBoundary.js +30 -0
  43. package/dist/Editor/MiniEditor.js +1 -3
  44. package/dist/Editor/Styles/EditorStyles.js +23 -0
  45. package/dist/Editor/Toolbar/Basic/index.js +2 -4
  46. package/dist/Editor/Toolbar/FormatTools/Dropdown.js +2 -26
  47. package/dist/Editor/Toolbar/FormatTools/MarkButton.js +2 -2
  48. package/dist/Editor/Toolbar/FormatTools/TextSize.js +18 -29
  49. package/dist/Editor/Toolbar/Mini/MiniToolbar.js +2 -4
  50. package/dist/Editor/Toolbar/Mini/Options/Options.js +0 -10
  51. package/dist/Editor/Toolbar/Mini/Styles.js +0 -7
  52. package/dist/Editor/Toolbar/PopupTool/MiniTextFormat/SelectFontSize.js +11 -4
  53. package/dist/Editor/Toolbar/PopupTool/MiniTextFormat/SelectTypography.js +86 -213
  54. package/dist/Editor/Toolbar/PopupTool/MiniTextFormat/index.js +1 -2
  55. package/dist/Editor/Toolbar/PopupTool/PopupToolStyle.js +13 -20
  56. package/dist/Editor/Toolbar/PopupTool/TextFormat.js +8 -52
  57. package/dist/Editor/Toolbar/PopupTool/index.js +13 -6
  58. package/dist/Editor/Toolbar/Toolbar.js +7 -0
  59. package/dist/Editor/Toolbar/toolbarGroups.js +11 -48
  60. package/dist/Editor/assets/svg/AIIcons.js +1 -153
  61. package/dist/Editor/assets/svg/AddTemplateIcon.js +10 -13
  62. package/dist/Editor/assets/svg/TextIcon.js +5 -8
  63. package/dist/Editor/common/ColorPickerButton.js +9 -25
  64. package/dist/Editor/common/DnD/DragHandleButton.js +47 -56
  65. package/dist/Editor/common/Icon.js +8 -41
  66. package/dist/Editor/common/LinkSettings/NavComponents.js +2 -5
  67. package/dist/Editor/common/LinkSettings/index.js +2 -4
  68. package/dist/Editor/common/LinkSettings/navOptions.js +2 -7
  69. package/dist/Editor/common/LinkSettings/style.js +8 -11
  70. package/dist/Editor/common/MentionsPopup/index.js +12 -8
  71. package/dist/Editor/common/RnD/ContextMenu/CMenus.js +105 -0
  72. package/dist/Editor/common/RnD/ContextMenu/index.js +38 -0
  73. package/dist/Editor/common/RnD/ContextMenu/styles.js +21 -0
  74. package/dist/Editor/common/RnD/DragInfo/index.js +31 -0
  75. package/dist/Editor/common/RnD/DragInfo/styles.js +15 -0
  76. package/dist/Editor/common/RnD/DragOver/index.js +46 -0
  77. package/dist/Editor/common/RnD/DragOver/styles.js +23 -0
  78. package/dist/Editor/common/RnD/ElementOptions/Actions.js +82 -0
  79. package/dist/Editor/common/RnD/ElementOptions/Icons/LinkIcon.js +26 -0
  80. package/dist/Editor/common/RnD/ElementOptions/index.js +93 -0
  81. package/dist/Editor/common/RnD/ElementOptions/styles.js +41 -0
  82. package/dist/Editor/common/RnD/ElementSettings/OtherSettings/Link.js +153 -0
  83. package/dist/Editor/common/RnD/ElementSettings/OtherSettings/Settings.js +58 -0
  84. package/dist/Editor/common/RnD/ElementSettings/OtherSettings/index.js +7 -0
  85. package/dist/Editor/common/RnD/ElementSettings/Settings/BoxSettings.js +46 -0
  86. package/dist/Editor/common/RnD/ElementSettings/Settings/ButtonSettings.js +46 -0
  87. package/dist/Editor/common/RnD/ElementSettings/Settings/ImageSettings.js +46 -0
  88. package/dist/Editor/common/RnD/ElementSettings/Settings/TextSettings.js +30 -0
  89. package/dist/Editor/common/RnD/ElementSettings/Settings/VideoSettings.js +46 -0
  90. package/dist/Editor/common/RnD/ElementSettings/Settings/index.js +13 -0
  91. package/dist/Editor/common/RnD/ElementSettings/index.js +17 -0
  92. package/dist/Editor/common/RnD/ElementSettings/settingsConstants.js +14 -0
  93. package/dist/Editor/common/RnD/ElementSettings/styles.js +76 -0
  94. package/dist/Editor/common/RnD/GuideLines/BoundaryLine.js +52 -0
  95. package/dist/Editor/common/RnD/GuideLines/index.js +33 -0
  96. package/dist/Editor/common/RnD/GuideLines/styles.js +60 -0
  97. package/dist/Editor/common/RnD/OptionsPopup/index.js +50 -0
  98. package/dist/Editor/common/RnD/OptionsPopup/style.js +36 -0
  99. package/dist/Editor/common/RnD/RnDCopy.js +23 -0
  100. package/dist/Editor/common/RnD/ShadowElement.js +34 -0
  101. package/dist/Editor/common/RnD/SwitchViewport/SwitchViewport.js +40 -0
  102. package/dist/Editor/common/RnD/SwitchViewport/styles.js +24 -0
  103. package/dist/Editor/common/RnD/Theme/ViewportStimulator.js +63 -0
  104. package/dist/Editor/common/RnD/TransformHandles/CornerHandle.js +19 -0
  105. package/dist/Editor/common/RnD/TransformHandles/Icons/BottomRightIcon.js +13 -0
  106. package/dist/Editor/common/RnD/TransformHandles/SizeHandle.js +18 -0
  107. package/dist/Editor/common/RnD/TransformHandles/index.js +62 -0
  108. package/dist/Editor/common/RnD/Utils/alignmentDetection.js +26 -0
  109. package/dist/Editor/common/RnD/Utils/calculateDropItem.js +98 -0
  110. package/dist/Editor/common/RnD/Utils/collisionDetection.js +52 -0
  111. package/dist/Editor/common/RnD/Utils/gridDropItem.js +148 -0
  112. package/dist/Editor/common/RnD/Utils/index.js +251 -0
  113. package/dist/Editor/common/RnD/VirtualElement/index.js +76 -0
  114. package/dist/Editor/common/RnD/VirtualElement/styles.js +27 -0
  115. package/dist/Editor/common/RnD/VirtualElement/updateAutoProps.js +28 -0
  116. package/dist/Editor/common/RnD/index.js +503 -0
  117. package/dist/Editor/common/RnD/styles.js +4 -0
  118. package/dist/Editor/common/Section/index.js +28 -69
  119. package/dist/Editor/common/Section/styles.js +6 -12
  120. package/dist/Editor/common/Shorthands/elements.js +12 -54
  121. package/dist/Editor/common/StyleBuilder/boxStyle.js +30 -0
  122. package/dist/Editor/common/StyleBuilder/buttonStyle.js +2 -4
  123. package/dist/Editor/common/StyleBuilder/fieldTypes/bannerSpacing.js +16 -19
  124. package/dist/Editor/common/StyleBuilder/fieldTypes/borderRadius.js +7 -15
  125. package/dist/Editor/common/StyleBuilder/fieldTypes/buttonLink.js +1 -1
  126. package/dist/Editor/common/StyleBuilder/fieldTypes/color.js +7 -31
  127. package/dist/Editor/common/StyleBuilder/fieldTypes/fontSize.js +4 -13
  128. package/dist/Editor/common/StyleBuilder/fieldTypes/text.js +4 -2
  129. package/dist/Editor/common/StyleBuilder/fieldTypes/textOptions.js +4 -14
  130. package/dist/Editor/common/StyleBuilder/index.js +1 -1
  131. package/dist/Editor/common/StyleBuilder/sectionStyle.js +13 -2
  132. package/dist/Editor/common/iconslist.js +31 -0
  133. package/dist/Editor/helper/RnD/focusOnNewItem.js +39 -0
  134. package/dist/Editor/helper/RnD/scrollToNewSection.js +24 -0
  135. package/dist/Editor/helper/breakpoint.js +5 -0
  136. package/dist/Editor/helper/index.js +139 -0
  137. package/dist/Editor/helper/theme.js +48 -185
  138. package/dist/Editor/hooks/useBreakpoints.js +34 -0
  139. package/dist/Editor/hooks/useMouseMove.js +37 -12
  140. package/dist/Editor/hooks/useWindowMessage.js +7 -10
  141. package/dist/Editor/hooks/withCommon.js +2 -1
  142. package/dist/Editor/hooks/withErrorHandling.js +14 -0
  143. package/dist/Editor/plugins/withEmbeds.js +1 -1
  144. package/dist/Editor/plugins/withHTML.js +1 -1
  145. package/dist/Editor/plugins/withTable.js +1 -1
  146. package/dist/Editor/theme/ThemeList.js +173 -50
  147. package/dist/Editor/utils/RnD/RnDCtrlCmds.js +168 -0
  148. package/dist/Editor/utils/SlateUtilityFunctions.js +47 -163
  149. package/dist/Editor/utils/button.js +17 -1
  150. package/dist/Editor/utils/events.js +7 -54
  151. package/dist/Editor/utils/font.js +37 -40
  152. package/dist/Editor/utils/freegrid.js +49 -0
  153. package/dist/Editor/utils/helper.js +31 -31
  154. package/dist/Editor/utils/table.js +43 -51
  155. package/package.json +6 -4
  156. package/dist/Editor/Elements/AI/VoiceToText/AudioWave.js +0 -73
  157. package/dist/Editor/Elements/AI/VoiceToText/index.js +0 -167
  158. package/dist/Editor/Elements/AI/VoiceToText/style.js +0 -40
  159. package/dist/Editor/Elements/Link/LinkPopupStyles.js +0 -28
  160. package/dist/Editor/Elements/Redo/RedoButton.js +0 -14
  161. package/dist/Editor/Elements/Undo/UndoButton.js +0 -14
  162. package/dist/Editor/Toolbar/PopupTool/ThemeTextFormat.js +0 -438
  163. package/dist/Editor/assets/svg/RedoIcon.js +0 -27
  164. package/dist/Editor/assets/svg/SettingsIcon.js +0 -28
  165. package/dist/Editor/assets/svg/ThemeIcons.js +0 -291
  166. package/dist/Editor/assets/svg/UndoIcon.js +0 -27
  167. package/dist/Editor/common/CustomColorPicker/index.js +0 -106
  168. package/dist/Editor/common/CustomColorPicker/style.js +0 -53
  169. package/dist/Editor/common/CustomDialog/index.js +0 -94
  170. package/dist/Editor/common/CustomDialog/style.js +0 -67
  171. package/dist/Editor/common/CustomSelect.js +0 -33
  172. package/dist/Editor/hooks/useEditorTheme.js +0 -139
  173. package/dist/Editor/theme/index.js +0 -144
  174. package/dist/Editor/themeSettings/ActiveTheme.js +0 -72
  175. package/dist/Editor/themeSettings/buttons/index.js +0 -290
  176. package/dist/Editor/themeSettings/buttons/style.js +0 -21
  177. package/dist/Editor/themeSettings/colorTheme/index.js +0 -290
  178. package/dist/Editor/themeSettings/colorTheme/style.js +0 -77
  179. package/dist/Editor/themeSettings/fonts/PreviewElement.js +0 -123
  180. package/dist/Editor/themeSettings/fonts/index.js +0 -213
  181. package/dist/Editor/themeSettings/fonts/style.js +0 -44
  182. package/dist/Editor/themeSettings/icons.js +0 -60
  183. package/dist/Editor/themeSettings/index.js +0 -320
  184. package/dist/Editor/themeSettings/style.js +0 -152
  185. package/dist/Editor/themeSettingsAI/icons.js +0 -96
  186. package/dist/Editor/themeSettingsAI/index.js +0 -356
  187. package/dist/Editor/themeSettingsAI/saveTheme.js +0 -190
  188. package/dist/Editor/themeSettingsAI/style.js +0 -247
@@ -0,0 +1,153 @@
1
+ import React, { useEffect, useState } from "react";
2
+ import { Node, Transforms, Editor } from "slate";
3
+ import { ReactEditor } from "slate-react";
4
+ import LinkSettings from "../../../LinkSettings";
5
+ import { insertLink, removeLink } from "../../../../utils/link";
6
+ import { getBlockActive, isBlockActive, upateBlockActive } from "../../../../utils/SlateUtilityFunctions";
7
+ import { jsx as _jsx } from "react/jsx-runtime";
8
+ const Link = props => {
9
+ const {
10
+ onClose,
11
+ customProps,
12
+ editor,
13
+ path,
14
+ childType
15
+ } = props;
16
+ const pPath = path?.split("|")?.map(m => parseInt(m));
17
+ const element_path = [...pPath, 0];
18
+ const element = Node.get(editor, element_path);
19
+ const {
20
+ actionTrigger
21
+ } = element?.buttonLink || {};
22
+ const {
23
+ onClick
24
+ } = actionTrigger || {
25
+ options: []
26
+ };
27
+ const [blockProps, setBlockProps] = useState();
28
+ const [isActiveTextLink, setIsActiveTextLink] = useState(false);
29
+ useEffect(() => {
30
+ if (childType === "text") {
31
+ selectTextNode();
32
+ const p = getBlockActive(editor, "link")?.props || {};
33
+ const bp = {
34
+ name: Editor.string(editor, editor.selection),
35
+ navType: "webAddress",
36
+ navValue: p?.href,
37
+ openInNewTab: p?.target === "_blank"
38
+ };
39
+ setIsActiveTextLink(isBlockActive(editor, "link"));
40
+ setBlockProps(bp);
41
+ } else {
42
+ setBlockProps(getProps());
43
+ }
44
+ }, []);
45
+ const selectTextNode = () => {
46
+ try {
47
+ ReactEditor.focus(editor);
48
+ const range = Editor.range(editor, element_path);
49
+ Transforms.select(editor, range);
50
+ } catch (err) {
51
+ console.log(err);
52
+ }
53
+ };
54
+ const getProps = () => {
55
+ switch (childType) {
56
+ case "button":
57
+ return {
58
+ navType: element?.buttonLink?.linkType,
59
+ navValue: element?.url,
60
+ openInNewTab: element?.openInNewTab
61
+ };
62
+ case "image":
63
+ return {
64
+ navType: element?.linkType,
65
+ navValue: element?.webAddress,
66
+ openInNewTab: element?.isNewTab
67
+ };
68
+ default:
69
+ return {};
70
+ }
71
+ };
72
+ const getTransformedData = d => {
73
+ switch (childType) {
74
+ case "text":
75
+ selectTextNode();
76
+ return {
77
+ name: Editor.string(editor, editor.selection),
78
+ url: d?.navValue,
79
+ showInNewTab: d?.openInNewTab
80
+ };
81
+ case "image":
82
+ return {
83
+ linkType: d?.linkType,
84
+ webAddress: d?.navValue,
85
+ isNewTab: d?.openInNewTab
86
+ };
87
+ case "button":
88
+ return {
89
+ buttonLink: {
90
+ linkType: d?.linkType,
91
+ onClick
92
+ },
93
+ url: d?.navValue,
94
+ openInNewTab: d?.openInNewTab
95
+ };
96
+ default:
97
+ return {};
98
+ }
99
+ };
100
+ const updateTextLink = data => {
101
+ // remove link
102
+ if (!data?.url && isActiveTextLink) {
103
+ removeLink(editor);
104
+ return;
105
+ }
106
+ const upData = isActiveTextLink ? {
107
+ href: data?.url,
108
+ target: data?.showInNewTab ? "_blank" : "_self",
109
+ name: data?.name
110
+ } : data;
111
+ if (isActiveTextLink) {
112
+ // update text link
113
+ upateBlockActive(editor, "link", upData);
114
+ } else {
115
+ insertLink(editor, upData);
116
+ }
117
+ };
118
+ const onSave = data => {
119
+ try {
120
+ const updateData = {
121
+ ...data
122
+ };
123
+ delete updateData.children;
124
+
125
+ // for text we have defined method already
126
+ // to update leaf data
127
+ if (childType === "text") {
128
+ updateTextLink(data);
129
+ return;
130
+ }
131
+ Transforms.setNodes(editor, {
132
+ ...updateData
133
+ }, {
134
+ at: element_path
135
+ });
136
+ } catch (err) {
137
+ console.log(err);
138
+ }
139
+ };
140
+ return blockProps?.navType !== undefined ? /*#__PURE__*/_jsx(LinkSettings, {
141
+ handleClose: onClose,
142
+ onSave: d => {
143
+ const upData = getTransformedData(d);
144
+ onSave({
145
+ ...upData
146
+ });
147
+ onClose();
148
+ },
149
+ ...(blockProps || {}),
150
+ customProps: customProps
151
+ }) : null;
152
+ };
153
+ export default Link;
@@ -0,0 +1,58 @@
1
+ import React from "react";
2
+ import { Paper, Popper, Tooltip, Typography, Box, Divider, IconButton } from "@mui/material";
3
+ import CloseIcon from "@mui/icons-material/Close";
4
+ import { settingsLabel } from "../settingsConstants";
5
+ import SettingsComponents from "../Settings";
6
+ import { jsx as _jsx } from "react/jsx-runtime";
7
+ import { jsxs as _jsxs } from "react/jsx-runtime";
8
+ import { Fragment as _Fragment } from "react/jsx-runtime";
9
+ const Settings = props => {
10
+ const {
11
+ path,
12
+ childType,
13
+ open,
14
+ anchorEl,
15
+ placement,
16
+ onClose,
17
+ editor,
18
+ classes
19
+ } = props;
20
+ const title = settingsLabel[childType] || "Settings";
21
+ const Settings = SettingsComponents[childType];
22
+ return /*#__PURE__*/_jsx(_Fragment, {
23
+ children: /*#__PURE__*/_jsx(Popper, {
24
+ open: open,
25
+ anchorEl: anchorEl,
26
+ placement: placement,
27
+ sx: classes.root,
28
+ children: /*#__PURE__*/_jsxs(Paper, {
29
+ className: "papper-root",
30
+ children: [/*#__PURE__*/_jsxs(Typography, {
31
+ variant: "h6",
32
+ className: "item-wrapper title",
33
+ children: [title, /*#__PURE__*/_jsx(Box, {
34
+ component: "div",
35
+ children: /*#__PURE__*/_jsx(Tooltip, {
36
+ title: "Close",
37
+ arrow: true,
38
+ children: /*#__PURE__*/_jsx(IconButton, {
39
+ className: "closeBtn",
40
+ onClick: onClose,
41
+ children: /*#__PURE__*/_jsx(CloseIcon, {})
42
+ })
43
+ })
44
+ })]
45
+ }), /*#__PURE__*/_jsx(Divider, {}), /*#__PURE__*/_jsx(Box, {
46
+ component: "div",
47
+ className: "item-wrapper",
48
+ children: Settings ? /*#__PURE__*/_jsx(Settings, {
49
+ editor: editor,
50
+ path: path
51
+ }) : null
52
+ })]
53
+ })
54
+ })
55
+ });
56
+ };
57
+ Settings.defaultProps = {};
58
+ export default Settings;
@@ -0,0 +1,7 @@
1
+ import Settings from "./Settings";
2
+ import Link from "./Link";
3
+ const OtherSettings = {
4
+ link: Link,
5
+ settings: Settings
6
+ };
7
+ export default OtherSettings;
@@ -0,0 +1,46 @@
1
+ import React from "react";
2
+ import { Transforms, Node } from "slate";
3
+ import { Box } from "@mui/material";
4
+ import { StyleContent } from "../../../StyleBuilder";
5
+ import boxStyle from "../../../StyleBuilder/boxStyle";
6
+ import { jsx as _jsx } from "react/jsx-runtime";
7
+ const BoxSettings = props => {
8
+ const {
9
+ editor,
10
+ path
11
+ } = props;
12
+ const item_path = path?.split("|").map(m => parseInt(m));
13
+ const element_path = [...item_path];
14
+ const element = Node.get(editor, element_path);
15
+ const onChange = data => {
16
+ const updated_props = {
17
+ ...element,
18
+ ...data,
19
+ field_type: data?.element
20
+ };
21
+ delete updated_props.children;
22
+ Transforms.setNodes(editor, {
23
+ ...updated_props
24
+ }, {
25
+ at: element_path
26
+ });
27
+ };
28
+ const handleClose = () => {
29
+ console.log("close");
30
+ };
31
+ return /*#__PURE__*/_jsx(Box, {
32
+ component: "div",
33
+ className: "item-w",
34
+ children: boxStyle?.map((m, i) => {
35
+ return /*#__PURE__*/_jsx(StyleContent, {
36
+ renderTabs: boxStyle,
37
+ value: m.value,
38
+ element: element,
39
+ onChange: onChange,
40
+ customProps: {},
41
+ handleClose: handleClose
42
+ }, `tab_${m.value}_$${i}`);
43
+ })
44
+ });
45
+ };
46
+ export default BoxSettings;
@@ -0,0 +1,46 @@
1
+ import React from "react";
2
+ import { Transforms, Node } from "slate";
3
+ import { Box } from "@mui/material";
4
+ import { StyleContent } from "../../../StyleBuilder";
5
+ import buttonStyle from "../../../StyleBuilder/buttonStyle";
6
+ import { jsx as _jsx } from "react/jsx-runtime";
7
+ const ButtonSettings = props => {
8
+ const {
9
+ editor,
10
+ path
11
+ } = props;
12
+ const item_path = path?.split("|").map(m => parseInt(m));
13
+ const element_path = [...item_path, 0];
14
+ const element = Node.get(editor, element_path);
15
+ const onChange = data => {
16
+ const updated_props = {
17
+ ...element,
18
+ ...data,
19
+ field_type: data?.element
20
+ };
21
+ delete updated_props.children;
22
+ Transforms.setNodes(editor, {
23
+ ...updated_props
24
+ }, {
25
+ at: element_path
26
+ });
27
+ };
28
+ const handleClose = () => {
29
+ console.log("close");
30
+ };
31
+ return /*#__PURE__*/_jsx(Box, {
32
+ component: "div",
33
+ className: "item-w",
34
+ children: buttonStyle?.map((m, i) => {
35
+ return /*#__PURE__*/_jsx(StyleContent, {
36
+ renderTabs: buttonStyle,
37
+ value: m.value,
38
+ element: element,
39
+ onChange: onChange,
40
+ customProps: {},
41
+ handleClose: handleClose
42
+ }, `tab_${m.value}_$${i}`);
43
+ })
44
+ });
45
+ };
46
+ export default ButtonSettings;
@@ -0,0 +1,46 @@
1
+ import React from "react";
2
+ import { Transforms, Node } from "slate";
3
+ import { Box } from "@mui/material";
4
+ import { StyleContent } from "../../../StyleBuilder";
5
+ import embedImageStyle from "../../../StyleBuilder/embedImageStyle";
6
+ import { jsx as _jsx } from "react/jsx-runtime";
7
+ const ImageSettings = props => {
8
+ const {
9
+ editor,
10
+ path
11
+ } = props;
12
+ const item_path = path?.split("|").map(m => parseInt(m));
13
+ const element_path = [...item_path, 0];
14
+ const element = Node.get(editor, element_path);
15
+ const onChange = data => {
16
+ const updated_props = {
17
+ ...element,
18
+ ...data,
19
+ field_type: data?.element
20
+ };
21
+ delete updated_props.children;
22
+ Transforms.setNodes(editor, {
23
+ ...updated_props
24
+ }, {
25
+ at: element_path
26
+ });
27
+ };
28
+ const handleClose = () => {
29
+ console.log("close");
30
+ };
31
+ return /*#__PURE__*/_jsx(Box, {
32
+ component: "div",
33
+ className: "item-w",
34
+ children: embedImageStyle?.map((m, i) => {
35
+ return /*#__PURE__*/_jsx(StyleContent, {
36
+ renderTabs: embedImageStyle,
37
+ value: m.value,
38
+ element: element,
39
+ onChange: onChange,
40
+ customProps: {},
41
+ handleClose: handleClose
42
+ }, `tab_${m.value}_$${i}`);
43
+ })
44
+ });
45
+ };
46
+ export default ImageSettings;
@@ -0,0 +1,30 @@
1
+ import React, { useEffect } from "react";
2
+ import { Editor, Transforms } from "slate";
3
+ import TextFormat from "../../../../Toolbar/PopupTool/TextFormat";
4
+ import usePopupStyle from "../../../../Toolbar/PopupTool/PopupToolStyle";
5
+ import { ReactEditor } from "slate-react";
6
+ import { jsx as _jsx } from "react/jsx-runtime";
7
+ const TextSettings = props => {
8
+ const {
9
+ editor,
10
+ path
11
+ } = props;
12
+ const item_path = path.split("|").map(m => parseInt(m));
13
+ const element_path = [...item_path, 0];
14
+ const classes = usePopupStyle();
15
+ useEffect(() => {
16
+ try {
17
+ ReactEditor.focus(editor);
18
+ const range = Editor.range(editor, element_path);
19
+ Transforms.select(editor, range);
20
+ ReactEditor.focus(editor);
21
+ } catch (err) {
22
+ console.log(err);
23
+ }
24
+ }, []);
25
+ return /*#__PURE__*/_jsx(TextFormat, {
26
+ classes: classes,
27
+ editor: editor
28
+ });
29
+ };
30
+ export default TextSettings;
@@ -0,0 +1,46 @@
1
+ import React from "react";
2
+ import { Transforms, Node } from "slate";
3
+ import { Box } from "@mui/material";
4
+ import { StyleContent } from "../../../StyleBuilder";
5
+ import embedVideoStyle from "../../../StyleBuilder/embedVideoStyle";
6
+ import { jsx as _jsx } from "react/jsx-runtime";
7
+ const VideoSettings = props => {
8
+ const {
9
+ editor,
10
+ path
11
+ } = props;
12
+ const item_path = path?.split("|").map(m => parseInt(m));
13
+ const element_path = [...item_path, 0];
14
+ const element = Node.get(editor, element_path);
15
+ const onChange = data => {
16
+ const updated_props = {
17
+ ...element,
18
+ ...data,
19
+ field_type: data?.element
20
+ };
21
+ delete updated_props.children;
22
+ Transforms.setNodes(editor, {
23
+ ...updated_props
24
+ }, {
25
+ at: element_path
26
+ });
27
+ };
28
+ const handleClose = () => {
29
+ console.log("close");
30
+ };
31
+ return /*#__PURE__*/_jsx(Box, {
32
+ component: "div",
33
+ className: "item-w",
34
+ children: embedVideoStyle?.map((m, i) => {
35
+ return /*#__PURE__*/_jsx(StyleContent, {
36
+ renderTabs: embedVideoStyle,
37
+ value: m.value,
38
+ element: element,
39
+ onChange: onChange,
40
+ customProps: {},
41
+ handleClose: handleClose
42
+ }, `tab_${m.value}_$${i}`);
43
+ })
44
+ });
45
+ };
46
+ export default VideoSettings;
@@ -0,0 +1,13 @@
1
+ import TextSettings from "./TextSettings";
2
+ import ButtonSettings from "./ButtonSettings";
3
+ import ImageSettings from "./ImageSettings";
4
+ import VideoSettings from "./VideoSettings";
5
+ import BoxSettings from "./BoxSettings";
6
+ const SettingsComponents = {
7
+ text: TextSettings,
8
+ button: ButtonSettings,
9
+ image: ImageSettings,
10
+ video: VideoSettings,
11
+ box: BoxSettings
12
+ };
13
+ export default SettingsComponents;
@@ -0,0 +1,17 @@
1
+ import React from "react";
2
+ import useElementSettingsStyle from "./styles";
3
+ import OtherSettings from "./OtherSettings";
4
+ import { jsx as _jsx } from "react/jsx-runtime";
5
+ const ElementSettings = props => {
6
+ const {
7
+ currentAction
8
+ } = props;
9
+ const classes = useElementSettingsStyle();
10
+ const Settings = OtherSettings[currentAction];
11
+ return Settings ? /*#__PURE__*/_jsx(Settings, {
12
+ classes: classes,
13
+ ...props
14
+ }) : null;
15
+ };
16
+ ElementSettings.defaultProps = {};
17
+ export default ElementSettings;
@@ -0,0 +1,14 @@
1
+ export const settingsLabel = {
2
+ text: "Text Settings",
3
+ button: "Button Settings",
4
+ image: "Image Settings",
5
+ video: "Video Settings",
6
+ box: "Box Settings"
7
+ };
8
+ export const ItemTypes = {
9
+ text: "Text",
10
+ button: "Button",
11
+ image: "Image",
12
+ video: "Video",
13
+ box: "Box"
14
+ };
@@ -0,0 +1,76 @@
1
+ const useElementSettingsStyle = theme => ({
2
+ root: {
3
+ zIndex: 1200,
4
+ background: "#FFF",
5
+ borderRadius: "10px",
6
+ overflow: "hidden",
7
+ boxShadow: "0px 0px 12px 4px #00000014",
8
+ padding: "10px 16px",
9
+ "& .papper-root": {
10
+ width: "312px",
11
+ boxShadow: "none"
12
+ },
13
+ ".MuiDivider-root": {
14
+ background: "#DCE4EC"
15
+ },
16
+ "& .closeBtn": {
17
+ borderRadius: "4px",
18
+ width: "26px",
19
+ height: "26px",
20
+ background: "#F8FAFC",
21
+ padding: "7px"
22
+ },
23
+ ".MuiAccordionSummary-root": {
24
+ minHeight: "40px !important",
25
+ padding: "0px"
26
+ },
27
+ ".MuiAccordionSummary-content": {
28
+ margin: "0px"
29
+ },
30
+ "& .MuiAccordion-root": {
31
+ boxShadow: "none",
32
+ "& .accordionTitle": {
33
+ display: "flex",
34
+ alignItems: "center"
35
+ },
36
+ "& .expandIcon": {
37
+ transform: "rotate(270deg)",
38
+ transition: "all 0.5s",
39
+ fill: "#64748B"
40
+ },
41
+ "&.Mui-expanded": {
42
+ "& .expandIcon": {
43
+ transform: "rotate(360deg)"
44
+ }
45
+ }
46
+ },
47
+ "& .item-w": {
48
+ maxHeight: "300px",
49
+ overflowX: "hidden",
50
+ overflowY: "auto"
51
+ },
52
+ "& .item-wrapper": {
53
+ fontFamily: "sans-serif",
54
+ padding: "5px 0px 12px 0px",
55
+ "& .text-formatter-popup": {
56
+ padding: "0px",
57
+ overflowX: "hidden"
58
+ },
59
+ "&.title": {
60
+ display: "flex",
61
+ fontSize: "16px",
62
+ fontWeight: "bold",
63
+ justifyContent: "space-between",
64
+ alignItems: "center",
65
+ "& .MuiIconButton-root": {
66
+ padding: "4px",
67
+ "& svg": {
68
+ width: "16px",
69
+ height: "16px"
70
+ }
71
+ }
72
+ }
73
+ }
74
+ }
75
+ });
76
+ export default useElementSettingsStyle;
@@ -0,0 +1,52 @@
1
+ import React from "react";
2
+ import { Box, useTheme } from "@mui/material";
3
+ import useGuideLineStyle from "./styles";
4
+ import { jsx as _jsx } from "react/jsx-runtime";
5
+ import { jsxs as _jsxs } from "react/jsx-runtime";
6
+ const SVGDashed = () => {
7
+ return /*#__PURE__*/_jsx("svg", {
8
+ width: "1",
9
+ height: "100%",
10
+ version: "1.1",
11
+ xmlns: "http://www.w3.org/2000/svg",
12
+ children: /*#__PURE__*/_jsx("line", {
13
+ strokeDasharray: "5, 5",
14
+ x1: "0",
15
+ y1: "100%",
16
+ x2: "1",
17
+ y2: "1",
18
+ style: {
19
+ stroke: "rgb(0, 0, 0)",
20
+ strokeWidth: 2
21
+ }
22
+ })
23
+ });
24
+ };
25
+ const BoundaryLine = () => {
26
+ const theme = useTheme();
27
+ const classes = useGuideLineStyle({
28
+ theme
29
+ });
30
+ return /*#__PURE__*/_jsxs(Box, {
31
+ component: "div",
32
+ sx: classes.boundaryLine,
33
+ children: [/*#__PURE__*/_jsx(Box, {
34
+ component: "div",
35
+ className: "rnd-guideline-lv",
36
+ contentEditable: false,
37
+ children: /*#__PURE__*/_jsx(SVGDashed, {})
38
+ }), /*#__PURE__*/_jsx(Box, {
39
+ component: "div",
40
+ className: "rnd-guideline-rv",
41
+ contentEditable: false,
42
+ children: /*#__PURE__*/_jsx(SVGDashed, {})
43
+ }), /*#__PURE__*/_jsx(Box, {
44
+ component: "div",
45
+ className: "white-wrapper w_left"
46
+ }), /*#__PURE__*/_jsx(Box, {
47
+ component: "div",
48
+ className: "white-wrapper w_right"
49
+ })]
50
+ });
51
+ };
52
+ export default BoundaryLine;
@@ -0,0 +1,33 @@
1
+ import React from "react";
2
+ import { Box, useTheme } from "@mui/material";
3
+ import useGuideLineStyle from "./styles";
4
+ import { jsx as _jsx } from "react/jsx-runtime";
5
+ const GuideLines = props => {
6
+ const theme = useTheme();
7
+ const classes = useGuideLineStyle({
8
+ theme
9
+ });
10
+ const {
11
+ lines
12
+ } = props;
13
+ const renderGuideLine = ({
14
+ x,
15
+ y,
16
+ width,
17
+ height
18
+ }, index) => {
19
+ return /*#__PURE__*/_jsx(Box, {
20
+ sx: classes.root,
21
+ component: "span",
22
+ className: "rnd-guideline",
23
+ style: {
24
+ left: x,
25
+ top: y,
26
+ width,
27
+ height
28
+ }
29
+ }, `rnd-gl-${index}_${x}_${y}`);
30
+ };
31
+ return lines?.length ? lines?.map(renderGuideLine) : null;
32
+ };
33
+ export default GuideLines;