@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,7 +1,7 @@
1
1
  import React, { useState, useEffect } from "react";
2
2
  import { useSlateStatic, ReactEditor } from "slate-react";
3
3
  import { Node, Transforms } from "slate";
4
- import { IconButton, Tooltip, Box, useTheme } from "@mui/material";
4
+ import { IconButton, Tooltip, Box } from "@mui/material";
5
5
  import DeleteIcon from "@mui/icons-material/Delete";
6
6
  import AspectRatioIcon from "@mui/icons-material/AspectRatio";
7
7
  import Icon from "../../common/Icon";
@@ -10,7 +10,7 @@ import EmbedPopup from "./EmbedPopup";
10
10
  import { GridSettingsIcon } from "../../common/iconslist";
11
11
  import { gradientBorder } from "../../utils/helper";
12
12
  import { getEmbedURL } from "../../helper";
13
- import { getBreakPointsValue, groupByBreakpoint } from "../../helper/theme";
13
+ import { getBreakPointsValue } from "../../helper/theme";
14
14
  import { jsx as _jsx } from "react/jsx-runtime";
15
15
  import { jsxs as _jsxs } from "react/jsx-runtime";
16
16
  const Video = ({
@@ -19,7 +19,6 @@ const Video = ({
19
19
  children,
20
20
  customProps
21
21
  }) => {
22
- const theme = useTheme();
23
22
  const {
24
23
  alt,
25
24
  alignment,
@@ -127,14 +126,12 @@ const Video = ({
127
126
  };
128
127
  } else {
129
128
  return {
130
- ...groupByBreakpoint({
131
- width: {
132
- ...getBreakPointsValue(getSize(), null, "overrideReSize", true)
133
- },
134
- height: url ? {
135
- ...getBreakPointsValue(getSize(), null, "overrideReSizeH", true)
136
- } : "auto"
137
- }, theme)
129
+ width: {
130
+ ...getBreakPointsValue(getSize(), null, "overrideReSize", true)
131
+ },
132
+ height: url ? {
133
+ ...getBreakPointsValue(getSize(), null, "overrideReSizeH", true)
134
+ } : "auto"
138
135
  };
139
136
  }
140
137
  };
@@ -208,7 +205,6 @@ const Video = ({
208
205
  onDelete: onDelete
209
206
  }) : null, /*#__PURE__*/_jsxs(Box, {
210
207
  component: "div",
211
- className: "embed-video-wrpr-in",
212
208
  contentEditable: false,
213
209
  sx: {
214
210
  position: "relative",
@@ -25,17 +25,13 @@ const EmojiButton = /*#__PURE__*/forwardRef((props, ref) => {
25
25
  }
26
26
  }));
27
27
  const onClick = () => {
28
- try {
29
- if (editor.selection) {
30
- const domRange = ReactEditor.toDOMRange(editor, editor.selection);
31
- const rect = domRange.getBoundingClientRect();
32
- setAnchorEl({
33
- getBoundingClientRect: () => rect,
34
- nodeType: 1
35
- });
36
- }
37
- } catch (err) {
38
- console.log(err);
28
+ if (editor.selection) {
29
+ const domRange = ReactEditor.toDOMRange(editor, editor.selection);
30
+ const rect = domRange.getBoundingClientRect();
31
+ setAnchorEl({
32
+ getBoundingClientRect: () => rect,
33
+ nodeType: 1
34
+ });
39
35
  }
40
36
  };
41
37
  const onEmojiSelect = emoji => {
@@ -4,12 +4,14 @@ import { jsx as _jsx } from "react/jsx-runtime";
4
4
  import { Fragment as _Fragment } from "react/jsx-runtime";
5
5
  const EmojiPicker = props => {
6
6
  const {
7
- onEmojiSelect
7
+ onEmojiSelect,
8
+ onClose
8
9
  } = props;
9
10
  return /*#__PURE__*/_jsx(_Fragment, {
10
11
  children: /*#__PURE__*/_jsx(Picker, {
11
12
  data: data,
12
- onEmojiSelect: onEmojiSelect
13
+ onEmojiSelect: onEmojiSelect,
14
+ onClickOutside: onClose
13
15
  })
14
16
  });
15
17
  };
@@ -119,7 +119,7 @@ const Form = props => {
119
119
  if (fieldData?.element === "email") {
120
120
  rule.push(`isEmail`);
121
121
  }
122
- if (fieldData?.required || fieldData?.element === "email") {
122
+ if (fieldData?.required && fieldData?.element === "email") {
123
123
  validations.push({
124
124
  name: pair[0],
125
125
  value: pair[1],
@@ -71,11 +71,11 @@ const FormWorkflow = props => {
71
71
  children: [/*#__PURE__*/_jsx(Grid, {
72
72
  item: true,
73
73
  sx: classes.radioBtn,
74
- children: /*#__PURE__*/_jsx(RadioGroup, {
74
+ children: /*#__PURE__*/_jsxs(RadioGroup, {
75
75
  name: "set timing",
76
76
  value: schedule,
77
77
  defaultValue: 1,
78
- children: /*#__PURE__*/_jsx(FormControlLabel, {
78
+ children: [/*#__PURE__*/_jsx(FormControlLabel, {
79
79
  value: "immediately",
80
80
  label: "Immediately",
81
81
  onChange: () => {
@@ -84,7 +84,16 @@ const FormWorkflow = props => {
84
84
  control: /*#__PURE__*/_jsx(Radio, {
85
85
  size: "small"
86
86
  })
87
- })
87
+ }), /*#__PURE__*/_jsx(FormControlLabel, {
88
+ value: "after",
89
+ label: "After",
90
+ onChange: () => {
91
+ setSchedule("after");
92
+ },
93
+ control: /*#__PURE__*/_jsx(Radio, {
94
+ size: "small"
95
+ })
96
+ })]
88
97
  })
89
98
  }), schedule === "after" && /*#__PURE__*/_jsx(Grid, {
90
99
  item: true,
@@ -39,7 +39,8 @@ const UserInputs = props => {
39
39
  fontStyleOptions: ['underline'],
40
40
  hideLink: true,
41
41
  hideTextColor: true
42
- }
42
+ },
43
+ theme: theme
43
44
  })
44
45
  })
45
46
  });
@@ -1,8 +1,8 @@
1
1
  /* eslint-disable no-unused-vars */
2
2
  import React, { useState } from "react";
3
- import { Transforms, Path } from "slate";
3
+ import { Transforms, Path, Node } from "slate";
4
4
  import { useSlateStatic, ReactEditor } from "slate-react";
5
- import { IconButton, Tooltip, Grid as GridContainer, useTheme } from "@mui/material";
5
+ import { IconButton, Tooltip, Grid as GridContainer } from "@mui/material";
6
6
  import ArrowUpwardIcon from "@mui/icons-material/ArrowUpward";
7
7
  import ArrowDownwardIcon from "@mui/icons-material/ArrowDownward";
8
8
  import KeyboardReturnIcon from "@mui/icons-material/KeyboardReturn";
@@ -13,8 +13,9 @@ import GridPopup from "./GridPopup";
13
13
  import SectionPopup from "./SectionPopup";
14
14
  import { gridItem } from "../../utils/gridItem";
15
15
  import { useEditorContext, useEditorSelection } from "../../hooks/useMouseMove";
16
- import { getTRBLBreakPoints, getBreakPointsValue, groupByBreakpoint } from "../../helper/theme";
16
+ import { getTRBLBreakPoints, getBreakPointsValue } from "../../helper/theme";
17
17
  import useWindowResize from "../../hooks/useWindowResize";
18
+ import { useTheme } from "@emotion/react";
18
19
  import { jsx as _jsx } from "react/jsx-runtime";
19
20
  import { Fragment as _Fragment } from "react/jsx-runtime";
20
21
  import { jsxs as _jsxs } from "react/jsx-runtime";
@@ -29,11 +30,16 @@ const GridToolBar = ({
29
30
  onAddGridItem,
30
31
  onAddSection,
31
32
  onMoveSection,
32
- path
33
+ path,
34
+ isSectionFullWidth
33
35
  }) => {
34
36
  return selected && !showTool ? /*#__PURE__*/_jsxs("div", {
35
37
  className: "grid-container-toolbar",
36
38
  contentEditable: false,
39
+ style: isSectionFullWidth ? {
40
+ right: "4px",
41
+ top: "4px"
42
+ } : {},
37
43
  children: [/*#__PURE__*/_jsx(Tooltip, {
38
44
  title: "Grid Settings",
39
45
  arrow: true,
@@ -74,6 +80,17 @@ const GridToolBar = ({
74
80
  }) : null]
75
81
  }) : null;
76
82
  };
83
+ const getParentEl = (editor, path) => {
84
+ try {
85
+ if (path?.length) {
86
+ return Node.parent(editor, path);
87
+ } else {
88
+ return null;
89
+ }
90
+ } catch (err) {
91
+ return null;
92
+ }
93
+ };
77
94
  const Grid = props => {
78
95
  const theme = useTheme();
79
96
  const {
@@ -114,6 +131,11 @@ const Grid = props => {
114
131
  const selected = hoverPath === path.join(",");
115
132
  const [showTool] = useEditorSelection(editor);
116
133
  const [size] = useWindowResize();
134
+ const parentElement = getParentEl(editor, path);
135
+ const {
136
+ sectionGridSize
137
+ } = parentElement || {};
138
+ const isSectionFullWidth = sectionGridSize && sectionGridSize[size?.device] >= 12;
117
139
  const onAddGridItem = () => {
118
140
  const currentPath = editor.selection?.anchor?.path;
119
141
  const ancestorsPath = Path.ancestors(currentPath, {
@@ -276,14 +298,6 @@ const Grid = props => {
276
298
  bottomLeft,
277
299
  bottomRight
278
300
  } = getBreakPointsValue(borderRadius, size?.device) || {};
279
- const gridcwrprProps = groupByBreakpoint({
280
- padding: {
281
- ...getTRBLBreakPoints(bannerSpacing)
282
- },
283
- flexWrap: {
284
- ...getBreakPointsValue(flexWrap || "wrap")
285
- }
286
- }, theme);
287
301
  return /*#__PURE__*/_jsxs(GridContainer, {
288
302
  container: true,
289
303
  className: `grid-container ${grid} has-hover element-root dpath`,
@@ -336,7 +350,8 @@ const Grid = props => {
336
350
  onAddGridItem: onAddGridItem,
337
351
  onAddSection: onAddSection,
338
352
  onMoveSection: onMoveSection,
339
- path: path
353
+ path: path,
354
+ isSectionFullWidth: isSectionFullWidth
340
355
  })]
341
356
  }), openSetttings ? /*#__PURE__*/_jsx(PoupComp, {
342
357
  element: element,
@@ -349,11 +364,16 @@ const Grid = props => {
349
364
  className: "grid-c-wrpr",
350
365
  sx: {
351
366
  display: "flex",
352
- ...gridcwrprProps,
367
+ padding: {
368
+ ...getTRBLBreakPoints(bannerSpacing)
369
+ },
353
370
  alignItems: vertical || "start",
354
371
  justifyContent: horizantal || "start",
355
372
  flexDirection: flexDirection || "row",
356
373
  width: "100%",
374
+ flexWrap: {
375
+ ...getBreakPointsValue(flexWrap || "wrap")
376
+ },
357
377
  height: "auto"
358
378
  },
359
379
  "data-path": path.join(","),
@@ -1,15 +1,14 @@
1
1
  /* eslint-disable no-unused-vars */
2
2
  import React, { useState } from "react";
3
- import { useTheme } from "@mui/material";
4
- import { Transforms } from "slate";
3
+ import { Transforms, Node } from "slate";
5
4
  import { useSlateStatic, ReactEditor } from "slate-react";
6
5
  import GridItemPopup from "./GridItemPopup";
7
6
  import { IconButton, Tooltip, Box, Grid as Item } from "@mui/material";
8
7
  import { GridSettingsIcon } from "../../common/iconslist";
9
8
  import { useEditorContext, useEditorSelection } from "../../hooks/useMouseMove";
10
- import { groupByBreakpoint, getBreakPointsValue, getBRValue, getTRBLBreakPoints } from "../../helper/theme";
9
+ import { getBreakPointsValue, getTRBLBreakPoints } from "../../helper/theme";
11
10
  import { isEmptyNode } from "../../utils/helper";
12
- import { wrapThemeBreakpoints } from "../FreeGrid/breakpointConstants";
11
+ import { useTheme } from "@emotion/react";
13
12
  import { jsx as _jsx } from "react/jsx-runtime";
14
13
  import { jsxs as _jsxs } from "react/jsx-runtime";
15
14
  const GridItemToolbar = ({
@@ -105,44 +104,35 @@ const GridItem = props => {
105
104
  const getBorderColor = () => {
106
105
  return borderColor || "transparent";
107
106
  };
108
- const getBRProps = groupByBreakpoint({
109
- display: {
110
- xs: xsHidden ? "none" : "inline-block",
111
- lg: "inline-block"
112
- },
113
- width: {
114
- ...getBreakPointsValue(grid, null, "overrideGridSize", true)
115
- },
116
- height: {
117
- ...getBreakPointsValue(cellGHeight || "auto")
118
- },
119
- borderRadius: {
120
- ...getBreakPointsValue(borderRadius || {}, null, "overrideBorderRadius", true)
121
- },
122
- margin: {
123
- ...getTRBLBreakPoints(margin)
124
- }
125
- }, theme);
126
- const giInProps = groupByBreakpoint({
127
- padding: {
128
- ...getTRBLBreakPoints(bannerSpacing)
129
- }
130
- }, theme);
131
107
  return /*#__PURE__*/_jsxs(Item, {
132
108
  item: true,
133
109
  component: "div",
134
110
  className: `grid-item element-root gi-top-wrpr dpath`,
135
111
  ...attributes,
136
112
  sx: {
137
- ...getBRProps,
138
- display: "flex",
113
+ width: {
114
+ ...getBreakPointsValue(grid, null, "overrideGridSize", true)
115
+ },
116
+ height: {
117
+ ...getBreakPointsValue(cellGHeight || "auto")
118
+ },
119
+ display: {
120
+ lg: "flex",
121
+ xs: xsHidden ? "none" : "flex"
122
+ },
139
123
  flexDirection: flexDirection || "column",
140
- background: bgColor || "transparent",
124
+ background: bgColor,
141
125
  borderColor: getBorderColor(),
142
126
  borderWidth: borderWidth || "1px",
127
+ borderRadius: {
128
+ ...getBreakPointsValue(borderRadius || {}, null, "overrideBorderRadius", true)
129
+ },
143
130
  borderStyle: borderStyle || "solid",
144
131
  alignItems: horizantal,
145
132
  justifyContent: vertical,
133
+ margin: {
134
+ ...getTRBLBreakPoints(margin)
135
+ },
146
136
  "&:hover": {
147
137
  background: `${bgColorHover || bgColor || "transparent"}`
148
138
  }
@@ -181,7 +171,9 @@ const GridItem = props => {
181
171
  sx: {
182
172
  display: "flex",
183
173
  flexDirection: flexDirection || "column",
184
- ...giInProps,
174
+ padding: {
175
+ ...getTRBLBreakPoints(bannerSpacing)
176
+ },
185
177
  width: "100%",
186
178
  height: "100%",
187
179
  color: textColor || "#000",
@@ -9,6 +9,7 @@ import { removeLink } from "../../utils/link";
9
9
  import LinkPopup from "./LinkPopup";
10
10
  import "./styles.css";
11
11
  import { absoluteLink } from "../../utils/helper";
12
+ import { useEditorContext } from "../../hooks/useMouseMove";
12
13
  import { jsx as _jsx } from "react/jsx-runtime";
13
14
  import { jsxs as _jsxs } from "react/jsx-runtime";
14
15
  const Link = props => {
@@ -29,6 +30,9 @@ const Link = props => {
29
30
  const path = ReactEditor.findPath(editor, element);
30
31
  const urlPath = element.url || element.href;
31
32
  const absLink = absoluteLink(urlPath);
33
+ const {
34
+ theme
35
+ } = useEditorContext();
32
36
  const updateLink = () => {
33
37
  Transforms.setNodes(editor, {
34
38
  href: linkData?.url,
@@ -107,7 +111,8 @@ const Link = props => {
107
111
  linkData: linkData,
108
112
  handleClose: handleClose,
109
113
  handleInputChange: handleInputChange,
110
- handleInsertLink: updateLink
114
+ handleInsertLink: updateLink,
115
+ theme: theme
111
116
  })]
112
117
  });
113
118
  };
@@ -9,7 +9,8 @@ import { jsx as _jsx } from "react/jsx-runtime";
9
9
  import { jsxs as _jsxs } from "react/jsx-runtime";
10
10
  const LinkButton = props => {
11
11
  const {
12
- editor
12
+ editor,
13
+ theme
13
14
  } = props;
14
15
  const linkInputRef = useRef(null);
15
16
  const [showInput, setShowInput] = useState(false);
@@ -77,7 +78,8 @@ const LinkButton = props => {
77
78
  linkData: linkData,
78
79
  handleClose: handleClose,
79
80
  handleInputChange: handleInputChange,
80
- handleInsertLink: handleInsertLink
81
+ handleInsertLink: handleInsertLink,
82
+ theme: theme
81
83
  })]
82
84
  });
83
85
  };
@@ -1,6 +1,7 @@
1
1
  import React from "react";
2
2
  import { Dialog, DialogActions, DialogContent, DialogTitle, FormControl, FormControlLabel, Grid, TextField, Button, IconButton, Typography, Checkbox } from "@mui/material";
3
3
  import CloseIcon from "@mui/icons-material/Close";
4
+ import LinkPopupStyles from "./LinkPopupStyles";
4
5
  import { jsx as _jsx } from "react/jsx-runtime";
5
6
  import { jsxs as _jsxs } from "react/jsx-runtime";
6
7
  const LinkPopup = props => {
@@ -9,8 +10,11 @@ const LinkPopup = props => {
9
10
  handleClose,
10
11
  linkData,
11
12
  handleInputChange,
12
- handleInsertLink
13
+ handleInsertLink,
14
+ theme
13
15
  } = props;
16
+ const themeType = localStorage.getItem("themeType");
17
+ const classes = LinkPopupStyles(themeType);
14
18
  return /*#__PURE__*/_jsxs(Dialog, {
15
19
  fullWidth: true,
16
20
  open: open,
@@ -44,13 +48,15 @@ const LinkPopup = props => {
44
48
  style: {
45
49
  paddingTop: "12px"
46
50
  },
51
+ className: classes.titleTypo,
47
52
  children: /*#__PURE__*/_jsx(TextField, {
48
53
  size: "small",
49
54
  fullWidth: true,
50
55
  value: linkData?.name,
51
56
  name: "name",
52
57
  placeholder: "Link Title",
53
- onChange: handleInputChange
58
+ onChange: handleInputChange,
59
+ sx: classes.addLinkField
54
60
  })
55
61
  }), /*#__PURE__*/_jsx(Grid, {
56
62
  item: true,
@@ -64,7 +70,8 @@ const LinkPopup = props => {
64
70
  name: "url",
65
71
  value: linkData?.url,
66
72
  placeholder: "https://google.com",
67
- onChange: handleInputChange
73
+ onChange: handleInputChange,
74
+ sx: classes.addLinkField
68
75
  })
69
76
  }), /*#__PURE__*/_jsx(Grid, {
70
77
  item: true,
@@ -0,0 +1,28 @@
1
+ const LinkPopupStyles = themeType => ({
2
+ addLinkField: {
3
+ "& .MuiOutlinedInput-input": {
4
+ fontSize: "12px",
5
+ fontWeight: 500,
6
+ color: themeType === "dark" ? "#FFFFFF !important" : "#000000 !important"
7
+ },
8
+ "& .MuiFormHelperText-root": {
9
+ color: themeType === "dark" ? "#FFFFFF !important" : "#000000 !important"
10
+ },
11
+ "& .MuiOutlinedInput-root": {
12
+ boxShadow: "0px 4px 10px rgba(0, 0, 0, 0.16)",
13
+ color: themeType === "dark" ? "#FFFFFF !important" : "#000000 !important",
14
+ borderRadius: "7px",
15
+ "& fieldset": {
16
+ borderColor: "#D8DDE1"
17
+ },
18
+ "&:hover fieldset": {
19
+ borderColor: "#64748B"
20
+ },
21
+ "&.Mui-focused fieldset": {
22
+ borderColor: "#2563EB"
23
+ },
24
+ "& .MuiFormLabel-root": {}
25
+ }
26
+ }
27
+ });
28
+ export default LinkPopupStyles;
@@ -1,9 +1,9 @@
1
1
  import React, { useState } from "react";
2
2
  import { useSlateStatic } from "slate-react";
3
3
  import PageSettingsPopup from "./PageSettingsPopup";
4
- import { PageSettings } from "../../common/iconslist";
5
4
  import ToolbarIcon from "../../common/ToolbarIcon";
6
5
  import { getPageSettings, updatePageSettings } from "../../utils/pageSettings";
6
+ import SettingsIcon from "../../assets/svg/SettingsIcon";
7
7
  import { jsx as _jsx } from "react/jsx-runtime";
8
8
  import { Fragment as _Fragment } from "react/jsx-runtime";
9
9
  import { jsxs as _jsxs } from "react/jsx-runtime";
@@ -11,7 +11,9 @@ const PageSettingsButton = props => {
11
11
  const {
12
12
  customProps,
13
13
  icoBtnType,
14
- from
14
+ from,
15
+ closePopper,
16
+ setToolTip
15
17
  } = props;
16
18
  const [openSetttings, setOpenSettings] = useState(false);
17
19
  const editor = useSlateStatic();
@@ -38,16 +40,18 @@ const PageSettingsButton = props => {
38
40
  }
39
41
  };
40
42
  const onClose = () => {
43
+ closePopper(true);
44
+ setToolTip(false);
41
45
  setOpenSettings(false);
42
46
  };
43
47
  return /*#__PURE__*/_jsxs(_Fragment, {
44
- children: [from === "miniToolBar" ? /*#__PURE__*/_jsx(PageSettings, {
48
+ children: [from === "miniToolBar" ? /*#__PURE__*/_jsx(SettingsIcon, {
45
49
  onClick: onSettings,
46
50
  className: "removeDefaultSvgCls"
47
51
  }) : /*#__PURE__*/_jsx(ToolbarIcon, {
48
52
  title: "Page Settings",
49
53
  onClick: onSettings,
50
- icon: /*#__PURE__*/_jsx(PageSettings, {}),
54
+ icon: /*#__PURE__*/_jsx(SettingsIcon, {}),
51
55
  icoBtnType: icoBtnType
52
56
  }), openSetttings !== false ? /*#__PURE__*/_jsx(PageSettingsPopup, {
53
57
  element: openSetttings?.element || {},
@@ -0,0 +1,14 @@
1
+ import React from "react";
2
+ import { useSlateStatic } from "slate-react";
3
+ import RedoIcon from "../../assets/svg/RedoIcon";
4
+ import { jsx as _jsx } from "react/jsx-runtime";
5
+ const RedoButton = () => {
6
+ const editor = useSlateStatic();
7
+ const onRedo = () => {
8
+ editor?.redo();
9
+ };
10
+ return /*#__PURE__*/_jsx(RedoIcon, {
11
+ onClick: onRedo
12
+ });
13
+ };
14
+ export default RedoButton;
@@ -263,7 +263,12 @@ const SignaturePopup = props => {
263
263
  name: "signedBy",
264
264
  placeholder: "Enter Name",
265
265
  size: "small",
266
- onChange: onChange
266
+ onChange: onChange,
267
+ sx: {
268
+ '& .MuiOutlinedInput-root .MuiOutlinedInput-notchedOutline': {
269
+ borderColor: '#ccc'
270
+ }
271
+ }
267
272
  })
268
273
  })]
269
274
  }), /*#__PURE__*/_jsxs(Grid, {
@@ -311,7 +316,8 @@ const SignaturePopup = props => {
311
316
  },
312
317
  children: [/*#__PURE__*/_jsx(Grid, {
313
318
  style: {
314
- marginRight: "8px"
319
+ marginRight: "8px",
320
+ minWidth: '44px'
315
321
  },
316
322
  children: /*#__PURE__*/_jsx("label", {
317
323
  htmlFor: "signedByEmail",
@@ -326,7 +332,12 @@ const SignaturePopup = props => {
326
332
  name: "signedByEmail",
327
333
  placeholder: "Enter Email",
328
334
  size: "small",
329
- onChange: onChange
335
+ onChange: onChange,
336
+ sx: {
337
+ '& .MuiOutlinedInput-root .MuiOutlinedInput-notchedOutline': {
338
+ borderColor: '#ccc'
339
+ }
340
+ }
330
341
  })
331
342
  })]
332
343
  })]
@@ -6,7 +6,7 @@ import { isTextSelected } from "../../utils/helper";
6
6
  import { useEditorContext } from "../../hooks/useMouseMove";
7
7
  import SimpleTextStyle from "./style";
8
8
  import { jsx as _jsx } from "react/jsx-runtime";
9
- import { createElement as _createElement } from "react";
9
+ import { jsxs as _jsxs } from "react/jsx-runtime";
10
10
  const SimpleText = props => {
11
11
  const {
12
12
  theme,
@@ -38,16 +38,15 @@ const SimpleText = props => {
38
38
  const showPlaceHolder = !readOnly && path.length === 1 && isEmpty;
39
39
  const isEmptyEditor = !readOnly && isEmpty && editor.children.length === 1 && !selected;
40
40
  const opacity = !isTextSelected(editor?.selection);
41
- const nextType = element?.children[0]?.type;
42
- return /*#__PURE__*/_createElement(Box, {
41
+ return /*#__PURE__*/_jsxs(Box, {
43
42
  ...element.attr,
44
43
  ...attributes,
45
- className: `simple-text ${nextType}`,
44
+ className: `simple-text`,
46
45
  sx: classes.root,
47
- key: `para_${path.join("|")}`
48
- }, children, openAI ? null : /*#__PURE__*/_jsx("span", {
49
- className: "placeholder-simple-text",
50
- children: isEmptyEditor ? editorPlaceholder || "Write Something..." : showPlaceHolder ? opacity && selected ? "Type / to browse elements" : "" : ""
51
- }));
46
+ children: [children, openAI ? null : /*#__PURE__*/_jsx("span", {
47
+ className: "placeholder-simple-text",
48
+ children: isEmptyEditor ? editorPlaceholder || "Write Something..." : showPlaceHolder ? opacity && selected ? "Type / to browse elements" : "" : ""
49
+ })]
50
+ });
52
51
  };
53
52
  export default SimpleText;
@@ -23,43 +23,6 @@ const SimpleTextStyle = ({
23
23
  background: "transparent",
24
24
  color: invertColor(pageColor)
25
25
  }
26
- },
27
- "& .freegrid-section": {
28
- "&.enable-1:before": {
29
- content: "' '",
30
- pointerEvents: "none",
31
- position: "absolute",
32
- left: "2px",
33
- top: "2px",
34
- width: "calc(100% - 4px)",
35
- height: "calc(100% - 4px)",
36
- outline: "2px solid #2563EB",
37
- zIndex: 1
38
- },
39
- "&:hover, &.enable-1": {
40
- "& .freegrid-section-infos": {
41
- pointerEvents: "none",
42
- position: "absolute",
43
- top: 0,
44
- left: 0,
45
- width: "100%",
46
- zIndex: 1,
47
- ":before": {
48
- position: "absolute",
49
- content: "attr(placeholder)",
50
- left: "0px",
51
- top: "0px",
52
- width: "auto",
53
- height: "auto",
54
- backgroundColor: "#8360FD",
55
- padding: "4px 6px",
56
- fontSize: "12px",
57
- fontWeight: "500",
58
- color: "#FFF",
59
- lineHeight: "12px"
60
- }
61
- }
62
- }
63
26
  }
64
27
  },
65
28
  section: {