@flozy/editor 10.4.2 → 10.4.4

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (165) hide show
  1. package/dist/Editor/ChatEditor.js +16 -17
  2. package/dist/Editor/CommonEditor.js +16 -131
  3. package/dist/Editor/DialogWrapper.js +25 -31
  4. package/dist/Editor/Editor.css +8 -46
  5. package/dist/Editor/Elements/AI/PopoverAIInput.js +3 -11
  6. package/dist/Editor/Elements/Accordion/Accordion.js +9 -46
  7. package/dist/Editor/Elements/Accordion/AccordionSummary.js +23 -1
  8. package/dist/Editor/Elements/AppHeader/AppHeader.js +5 -10
  9. package/dist/Editor/Elements/Button/EditorButton.js +9 -27
  10. package/dist/Editor/Elements/Carousel/CarouselItem.js +1 -2
  11. package/dist/Editor/Elements/Color Picker/ColorButtons.js +14 -61
  12. package/dist/Editor/Elements/Color Picker/ColorPicker.css +1 -25
  13. package/dist/Editor/Elements/Color Picker/ColorPicker.js +7 -10
  14. package/dist/Editor/Elements/Color Picker/Styles.js +13 -15
  15. package/dist/Editor/Elements/DataView/Layouts/DataTypes/Components/MultiSelect.js +26 -26
  16. package/dist/Editor/Elements/DataView/Layouts/DataTypes/MultiSelectType.js +5 -5
  17. package/dist/Editor/Elements/DataView/Layouts/Options/AddOptions.js +1 -0
  18. package/dist/Editor/Elements/Embed/Video.js +1 -1
  19. package/dist/Editor/Elements/Form/Form.js +3 -3
  20. package/dist/Editor/Elements/Form/FormElements/FormTextArea.js +1 -0
  21. package/dist/Editor/Elements/Form/FormField.js +2 -3
  22. package/dist/Editor/Elements/Form/Workflow/Styles.js +22 -24
  23. package/dist/Editor/Elements/FreeGrid/FreeGrid.js +31 -35
  24. package/dist/Editor/Elements/FreeGrid/FreeGridBox.js +4 -7
  25. package/dist/Editor/Elements/FreeGrid/FreeGridItem.js +0 -1
  26. package/dist/Editor/Elements/FreeGrid/Options/More.js +7 -7
  27. package/dist/Editor/Elements/FreeGrid/Options/sectionItemOptions.js +1 -1
  28. package/dist/Editor/Elements/FreeGrid/styles.js +0 -14
  29. package/dist/Editor/Elements/Grid/Grid.js +2 -14
  30. package/dist/Editor/Elements/Grid/GridItem.js +1 -1
  31. package/dist/Editor/Elements/Signature/Signature.css +1 -2
  32. package/dist/Editor/Elements/Signature/SignatureOptions/DrawSignature.js +5 -18
  33. package/dist/Editor/Elements/Signature/SignatureOptions/UploadSignature.js +3 -16
  34. package/dist/Editor/Elements/SimpleText/style.js +2 -2
  35. package/dist/Editor/Elements/Table/DragButton.js +1 -0
  36. package/dist/Editor/Elements/Table/Draggable.js +2 -6
  37. package/dist/Editor/Elements/Table/Styles.js +0 -7
  38. package/dist/Editor/Elements/Table/Table.js +3 -3
  39. package/dist/Editor/Elements/Table/TableCell.js +5 -24
  40. package/dist/Editor/Elements/Title/title.js +6 -6
  41. package/dist/Editor/Elements/Variables/VariableButton.js +1 -10
  42. package/dist/Editor/MiniEditor.js +1 -2
  43. package/dist/Editor/Styles/EditorStyles.js +5 -5
  44. package/dist/Editor/Toolbar/FormatTools/Dropdown.js +3 -27
  45. package/dist/Editor/Toolbar/FormatTools/FontFamilyAutocomplete.js +3 -4
  46. package/dist/Editor/Toolbar/FormatTools/MarkButton.js +2 -2
  47. package/dist/Editor/Toolbar/FormatTools/TextSize.js +13 -10
  48. package/dist/Editor/Toolbar/Mini/MiniToolbar.js +1 -2
  49. package/dist/Editor/Toolbar/PopupTool/MiniTextFormat/MiniColorPicker.js +2 -4
  50. package/dist/Editor/Toolbar/PopupTool/MiniTextFormat/SelectFontSize.js +13 -6
  51. package/dist/Editor/Toolbar/PopupTool/MiniTextFormat/SelectTypography.js +42 -167
  52. package/dist/Editor/Toolbar/PopupTool/MiniTextFormat/index.js +4 -7
  53. package/dist/Editor/Toolbar/PopupTool/PopperHeader.js +1 -2
  54. package/dist/Editor/Toolbar/PopupTool/PopupToolStyle.js +12 -72
  55. package/dist/Editor/Toolbar/PopupTool/TextFormat.js +10 -58
  56. package/dist/Editor/Toolbar/PopupTool/index.js +1 -1
  57. package/dist/Editor/Toolbar/toolbarGroups.js +6 -48
  58. package/dist/Editor/common/ColorPickerButton.js +16 -41
  59. package/dist/Editor/common/DnD/DragHandleButton.js +1 -1
  60. package/dist/Editor/common/FontLoader/FontLoader.js +0 -3
  61. package/dist/Editor/common/Icon.js +0 -28
  62. package/dist/Editor/common/ImageSelector/ImageSelector.js +2 -2
  63. package/dist/Editor/common/ImageSelector/Styles.js +9 -3
  64. package/dist/Editor/common/LinkSettings/NavComponents.js +65 -45
  65. package/dist/Editor/common/LinkSettings/index.js +28 -14
  66. package/dist/Editor/common/LinkSettings/navOptions.js +2 -2
  67. package/dist/Editor/common/LinkSettings/style.js +244 -164
  68. package/dist/Editor/common/MentionsPopup/index.js +1 -4
  69. package/dist/Editor/common/RnD/ElementOptions/Actions.js +5 -4
  70. package/dist/Editor/common/RnD/ElementSettings/OtherSettings/Settings.js +1 -2
  71. package/dist/Editor/common/RnD/ElementSettings/OtherSettings/Signature.js +3 -4
  72. package/dist/Editor/common/RnD/ElementSettings/Settings/AppHeaderSettings.js +2 -3
  73. package/dist/Editor/common/RnD/ElementSettings/Settings/BoxSettings.js +2 -3
  74. package/dist/Editor/common/RnD/ElementSettings/Settings/ButtonSettings.js +2 -3
  75. package/dist/Editor/common/RnD/ElementSettings/Settings/CodeSettings.js +2 -3
  76. package/dist/Editor/common/RnD/ElementSettings/Settings/FormSettings.js +2 -4
  77. package/dist/Editor/common/RnD/ElementSettings/Settings/ImageSettings.js +2 -3
  78. package/dist/Editor/common/RnD/ElementSettings/Settings/TableSettings.js +2 -3
  79. package/dist/Editor/common/RnD/ElementSettings/Settings/TextSettings.js +1 -3
  80. package/dist/Editor/common/RnD/ElementSettings/Settings/VideoSettings.js +2 -3
  81. package/dist/Editor/common/RnD/ElementSettings/styles.js +1 -0
  82. package/dist/Editor/common/RnD/OptionsPopup/style.js +1 -0
  83. package/dist/Editor/common/RnD/SwitchViewport/SwitchViewport.js +2 -11
  84. package/dist/Editor/common/RnD/Theme/ViewportStimulator.js +3 -6
  85. package/dist/Editor/common/RnD/Utils/gridDropItem.js +19 -28
  86. package/dist/Editor/common/RnD/Utils/index.js +1 -3
  87. package/dist/Editor/common/RnD/VirtualElement/VirtualTextElement.js +58 -42
  88. package/dist/Editor/common/RnD/VirtualElement/helper.js +132 -323
  89. package/dist/Editor/common/RnD/VirtualElement/styles.js +0 -16
  90. package/dist/Editor/common/RnD/index.js +39 -68
  91. package/dist/Editor/common/Select/index.js +7 -44
  92. package/dist/Editor/common/Select/styles.js +2 -30
  93. package/dist/Editor/common/Shorthands/elements.js +0 -54
  94. package/dist/Editor/common/StyleBuilder/accordionTitleBtnStyle.js +2 -2
  95. package/dist/Editor/common/StyleBuilder/accordionTitleStyle.js +9 -12
  96. package/dist/Editor/common/StyleBuilder/buttonStyle.js +2 -4
  97. package/dist/Editor/common/StyleBuilder/embedVideoStyle.js +0 -4
  98. package/dist/Editor/common/StyleBuilder/fieldTypes/backgroundImage.js +0 -5
  99. package/dist/Editor/common/StyleBuilder/fieldTypes/bannerSpacing.js +2 -12
  100. package/dist/Editor/common/StyleBuilder/fieldTypes/borderRadius.js +7 -15
  101. package/dist/Editor/common/StyleBuilder/fieldTypes/card.js +8 -16
  102. package/dist/Editor/common/StyleBuilder/fieldTypes/color.js +10 -36
  103. package/dist/Editor/common/StyleBuilder/fieldTypes/fontSize.js +7 -16
  104. package/dist/Editor/common/StyleBuilder/fieldTypes/index.js +1 -3
  105. package/dist/Editor/common/StyleBuilder/fieldTypes/textOptions.js +7 -15
  106. package/dist/Editor/common/SwipeableDrawer/style.js +12 -14
  107. package/dist/Editor/common/Uploader.js +0 -16
  108. package/dist/Editor/common/iconListV2.js +0 -76
  109. package/dist/Editor/common/iconslist.js +0 -21
  110. package/dist/Editor/commonStyle.js +61 -116
  111. package/dist/Editor/helper/index.js +1 -5
  112. package/dist/Editor/helper/theme.js +2 -203
  113. package/dist/Editor/hooks/useMouseMove.js +3 -9
  114. package/dist/Editor/hooks/useTable.js +4 -5
  115. package/dist/Editor/plugins/withEmbeds.js +1 -1
  116. package/dist/Editor/plugins/withHTML.js +1 -3
  117. package/dist/Editor/plugins/withTable.js +1 -1
  118. package/dist/Editor/theme/ThemeList.js +173 -50
  119. package/dist/Editor/utils/SlateUtilityFunctions.js +37 -161
  120. package/dist/Editor/utils/accordion.js +4 -14
  121. package/dist/Editor/utils/button.js +17 -1
  122. package/dist/Editor/utils/customHooks/useTableResize.js +9 -49
  123. package/dist/Editor/utils/draftToSlate.js +2 -3
  124. package/dist/Editor/utils/events.js +6 -50
  125. package/dist/Editor/utils/font.js +37 -40
  126. package/dist/Editor/utils/formfield.js +0 -1
  127. package/dist/Editor/utils/helper.js +26 -210
  128. package/dist/Editor/utils/insertAppHeader.js +1 -1
  129. package/dist/Editor/utils/signature.js +9 -2
  130. package/package.json +4 -4
  131. package/dist/Editor/Elements/FreeGrid/helper.js +0 -115
  132. package/dist/Editor/Toolbar/PopupTool/ThemeTextFormat.js +0 -439
  133. package/dist/Editor/assets/svg/BackIcon.js +0 -18
  134. package/dist/Editor/assets/svg/ThemeIcons.js +0 -293
  135. package/dist/Editor/common/Checkbox/index.js +0 -46
  136. package/dist/Editor/common/Checkbox/styles.js +0 -45
  137. package/dist/Editor/common/CustomColorPicker/index.js +0 -130
  138. package/dist/Editor/common/CustomColorPicker/style.js +0 -53
  139. package/dist/Editor/common/CustomDialog2/index.js +0 -94
  140. package/dist/Editor/common/CustomDialog2/style.js +0 -67
  141. package/dist/Editor/common/CustomSelect.js +0 -43
  142. package/dist/Editor/common/RadioGroup/index.js +0 -48
  143. package/dist/Editor/common/RadioGroup/styles.js +0 -29
  144. package/dist/Editor/common/RnD/Theme/MainThemeProvider.js +0 -17
  145. package/dist/Editor/common/StyleBuilder/fieldTypes/embedUpload.js +0 -115
  146. package/dist/Editor/helper/textIndeces.js +0 -58
  147. package/dist/Editor/hooks/useEditorTheme.js +0 -153
  148. package/dist/Editor/hooks/useThemeValues.js +0 -63
  149. package/dist/Editor/theme/index.js +0 -149
  150. package/dist/Editor/themeSettings/ActiveTheme.js +0 -82
  151. package/dist/Editor/themeSettings/buttons/index.js +0 -300
  152. package/dist/Editor/themeSettings/buttons/style.js +0 -23
  153. package/dist/Editor/themeSettings/colorTheme/index.js +0 -310
  154. package/dist/Editor/themeSettings/colorTheme/style.js +0 -81
  155. package/dist/Editor/themeSettings/fonts/PreviewElement.js +0 -121
  156. package/dist/Editor/themeSettings/fonts/index.js +0 -240
  157. package/dist/Editor/themeSettings/fonts/style.js +0 -62
  158. package/dist/Editor/themeSettings/icons.js +0 -60
  159. package/dist/Editor/themeSettings/index.js +0 -380
  160. package/dist/Editor/themeSettings/style.js +0 -299
  161. package/dist/Editor/themeSettingsAI/icons.js +0 -96
  162. package/dist/Editor/themeSettingsAI/index.js +0 -355
  163. package/dist/Editor/themeSettingsAI/saveTheme.js +0 -202
  164. package/dist/Editor/themeSettingsAI/style.js +0 -332
  165. package/dist/Editor/utils/updateFormName.js +0 -22
@@ -34,12 +34,12 @@ import SimpleText from "../Elements/SimpleText";
34
34
  import CheckList from "../Elements/List/CheckList";
35
35
  import { getTextColor, isEmptyTextNode } from "../helper";
36
36
  import Attachments from "../Elements/Attachments/Attachments";
37
- import { getBreakpointLineSpacing, getBreakPointsValue, getDevice, getElementProperty, textThemeFields } from "../helper/theme";
37
+ import { getBreakpointLineSpacing, getBreakPointsValue, getDevice, groupByBreakpoint } from "../helper/theme";
38
38
  import Variables from "../Elements/Variables/Variable";
39
+ import insertNewLine from "./insertNewLine";
39
40
  import Divider from "../Elements/Divider/Divider";
40
41
  import { getBorderColor, getSlateDom } from "./helper";
41
42
  import Code from "../Elements/EmbedScript/Code";
42
- import { ReactEditor } from "slate-react";
43
43
  import FreeGrid from "../Elements/FreeGrid/FreeGrid";
44
44
  import FreeGridItem from "../Elements/FreeGrid/FreeGridItem";
45
45
  import FreeGridBox from "../Elements/FreeGrid/FreeGridBox";
@@ -47,7 +47,7 @@ import DataView from "../Elements/DataView/DataView";
47
47
  import ViewData from "../Elements/DataView/Layouts/ViewData";
48
48
  import ColumnView from "../Elements/DataView/Layouts/ColumnView";
49
49
  import SearchAttachment from "../Elements/Search/SearchAttachment";
50
- import { wrapThemeBreakpoints } from "../Elements/FreeGrid/breakpointConstants";
50
+ // import { wrapThemeBreakpoints } from "../Elements/FreeGrid/breakpointConstants";
51
51
  import { jsx as _jsx } from "react/jsx-runtime";
52
52
  import { jsxs as _jsxs } from "react/jsx-runtime";
53
53
  const alignment = ["alignLeft", "alignRight", "alignCenter", "alignJustify"];
@@ -56,17 +56,7 @@ const LIST_FORMAT_TYPE = {
56
56
  orderedList: "list-item",
57
57
  unorderedList: "list-item"
58
58
  };
59
-
60
- // const NEWLINESAFTER = [
61
- // "headingOne",
62
- // "headingTwo",
63
- // "headingThree",
64
- // "headingFour",
65
- // "headingFive",
66
- // "headingSix",
67
- // ];
68
-
69
- const THEME_BLOCK_FIELDS = ["headingOne", "headingTwo", "headingThree", "headingFour", "headingFive", "headingSix", "paragraphOne", "paragraphTwo", "paragraphThree"];
59
+ const NEWLINESAFTER = ["headingOne", "headingTwo", "headingThree", "headingFour", "headingFive", "headingSix"];
70
60
  export const toggleBlock = (editor, format, selection = true, attr = {}) => {
71
61
  const isActive = isBlockActive(editor, format);
72
62
  const isList = list_types.includes(format);
@@ -99,9 +89,8 @@ export const toggleBlock = (editor, format, selection = true, attr = {}) => {
99
89
  if (!selection) {
100
90
  Transforms.insertText(editor, "");
101
91
  }
102
- const forActiveType = THEME_BLOCK_FIELDS.some(f => f === format) ? format : "paragraph";
103
92
  Transforms.setNodes(editor, {
104
- type: isActive ? forActiveType : isList ? LIST_FORMAT_TYPE[format] : format,
93
+ type: isActive ? "paragraph" : isList ? LIST_FORMAT_TYPE[format] : format,
105
94
  ...attr
106
95
  });
107
96
  if (isList && !isActive) {
@@ -110,12 +99,10 @@ export const toggleBlock = (editor, format, selection = true, attr = {}) => {
110
99
  children: []
111
100
  });
112
101
  }
113
-
114
- // if (NEWLINESAFTER.indexOf(format) > -1) {
115
- // insertNewLine(editor);
116
- // }
102
+ if (NEWLINESAFTER.indexOf(format) > -1) {
103
+ insertNewLine(editor);
104
+ }
117
105
  };
118
-
119
106
  export const addMarkData = (editor, data) => {
120
107
  try {
121
108
  Editor.addMark(editor, data.format, data.value);
@@ -124,14 +111,9 @@ export const addMarkData = (editor, data) => {
124
111
  }
125
112
  };
126
113
  export const toggleMark = (editor, format) => {
127
- const isActive = isMarkBtnActive(editor, format);
114
+ const isActive = isMarkActive(editor, format);
128
115
  if (isActive) {
129
- const isThemeSupportedMark = textThemeFields.some(f => f === format);
130
- if (isThemeSupportedMark) {
131
- Editor.addMark(editor, format, false);
132
- } else {
133
- Editor.removeMark(editor, format);
134
- }
116
+ Editor.removeMark(editor, format);
135
117
  } else {
136
118
  Editor.addMark(editor, format, true);
137
119
  }
@@ -145,58 +127,6 @@ export const isMarkActive = (editor, format) => {
145
127
  return null;
146
128
  }
147
129
  };
148
- export const isMarkBtnActive = (editor, format) => {
149
- switch (format) {
150
- case "bold":
151
- {
152
- const style = getSelectedElementStyle("font-weight", editor);
153
- return style === "700";
154
- }
155
- case "italic":
156
- {
157
- const style = getSelectedElementStyle("font-style", editor);
158
- return style === format;
159
- }
160
- // case "underline": {
161
- // const style = getSelectedElementStyle("text-decoration");
162
-
163
- // return style?.includes(format);
164
- // }
165
- // case "strikethrough": {
166
- // const style = getSelectedElementStyle("text-decoration");
167
-
168
- // return style?.includes("line-through");
169
- // }
170
- default:
171
- return isMarkActive(editor, format);
172
- }
173
- };
174
- export const getSelectedElementStyle = (styleProperty, editor, format) => {
175
- try {
176
- if (!editor.selection) {
177
- return "";
178
- }
179
- if (Range.isCollapsed(editor.selection)) {
180
- return "";
181
- }
182
- if (format) {
183
- const value = activeMark(editor, format, true);
184
- if (value) {
185
- return value;
186
- }
187
- }
188
- const domRange = ReactEditor.toDOMRange(editor, editor.selection);
189
- const selectedDomNode = domRange.commonAncestorContainer;
190
-
191
- // If it's a text node, get its parent element
192
- const selectedElement = selectedDomNode.nodeType === 3 ? selectedDomNode.parentElement : selectedDomNode;
193
- if (selectedElement) {
194
- return getElementProperty(selectedElement, styleProperty);
195
- }
196
- } catch (err) {
197
- console.log(err);
198
- }
199
- };
200
130
  export const isBlockActive = (editor, format) => {
201
131
  const [match] = Editor.nodes(editor, {
202
132
  match: n => !Editor.isEditor(n) && SlateElement.isElement(n) && n.type === format
@@ -222,7 +152,7 @@ export const upateBlockActive = (editor, format, attr = {}) => {
222
152
  });
223
153
  }
224
154
  };
225
- export const activeMark = (editor, format, noDefaultValue) => {
155
+ export const activeMark = (editor, format) => {
226
156
  const defaultMarkData = {
227
157
  color: "#000000",
228
158
  bgColor: "#FFFFFF",
@@ -232,7 +162,7 @@ export const activeMark = (editor, format, noDefaultValue) => {
232
162
  };
233
163
  try {
234
164
  const marks = Editor.marks(editor);
235
- let defaultValue = noDefaultValue ? "" : defaultMarkData[format];
165
+ let defaultValue = defaultMarkData[format];
236
166
  const {
237
167
  selection
238
168
  } = editor || {};
@@ -249,31 +179,6 @@ export const activeMark = (editor, format, noDefaultValue) => {
249
179
  return null;
250
180
  }
251
181
  };
252
-
253
- // to avoid the styles, that automatically assign from themes
254
- const getThemeMarkedLeaf = (leaf, children) => {
255
- const {
256
- italic,
257
- bold
258
- } = leaf || {};
259
- const style = {};
260
- if (italic === false) {
261
- style.fontStyle = "normal";
262
- }
263
- if (bold === false) {
264
- style.fontWeight = "normal";
265
- }
266
- if (Object.keys(style).length) {
267
- children = /*#__PURE__*/_jsx(Box, {
268
- component: "span",
269
- sx: {
270
- "& span": style
271
- },
272
- children: children
273
- });
274
- }
275
- return children;
276
- };
277
182
  export const getMarked = (leaf, children, theme) => {
278
183
  const className = leaf?.doublequote ? "doublequote" : "";
279
184
  const lineH = leaf?.lineHeight;
@@ -303,7 +208,6 @@ export const getMarked = (leaf, children, theme) => {
303
208
  children: children
304
209
  });
305
210
  }
306
- children = getThemeMarkedLeaf(leaf, children);
307
211
  if (leaf.strikethrough) {
308
212
  children = /*#__PURE__*/_jsx("span", {
309
213
  style: {
@@ -331,15 +235,6 @@ export const getMarked = (leaf, children, theme) => {
331
235
  if (leaf.color || leaf.bgColor || leaf.fontSize || leaf.fontFamily || leaf.fontWeight || lineHeight || className) {
332
236
  const family = leaf?.fontFamily;
333
237
  const textStyles = getTextColor(leaf?.color);
334
- const fontSize = {
335
- lg: sizeMap[leaf.fontSize] || leaf.fontSize,
336
- ...getBreakPointsValue(leaf.fontSize, null, "overrideText")
337
- };
338
- const fontSizesImportant = {};
339
- Object.entries(fontSize).forEach(([key, value]) => {
340
- fontSizesImportant[key] = `${value} !important`;
341
- });
342
- const fontSizeWithBreakpoints = wrapThemeBreakpoints(fontSizesImportant, "fontSize", theme);
343
238
  children = /*#__PURE__*/_jsx("span", {
344
239
  style: {
345
240
  background: leaf.bgColor
@@ -348,13 +243,12 @@ export const getMarked = (leaf, children, theme) => {
348
243
  className: `${className} leaf-item`,
349
244
  component: "span",
350
245
  sx: {
351
- "& span": {
352
- // fontSize: fontSizesImportant,
353
- // ...groupByBreakpoint(fontSizesImportant, theme),
354
- background: leaf.bgColor,
355
- ...fontSizeWithBreakpoints
356
- },
357
- ...fontSizeWithBreakpoints,
246
+ ...groupByBreakpoint({
247
+ fontSize: {
248
+ lg: sizeMap[leaf.fontSize] || leaf.fontSize,
249
+ ...getBreakPointsValue(leaf.fontSize, null, "overrideText")
250
+ }
251
+ }, theme),
358
252
  // ...wrapThemeBreakpoints(
359
253
  // {
360
254
  // lg: sizeMap[leaf.fontSize] || leaf.fontSize,
@@ -406,23 +300,15 @@ export const getBlock = props => {
406
300
  const {
407
301
  translation
408
302
  } = customProps;
409
- const commonHeadingProps = () => ({
410
- ...attributes,
411
- ...element.attr,
412
- className: `edt-headings content-editable ${isEmpty ? "empty" : ""} theme-element`
413
- });
414
- const commonParaProps = paraType => ({
415
- ...attributes,
416
- ...element.attr,
417
- className: `edt-paragraphs content-editable ${isEmpty ? "empty" : ""} theme-element ${paraType}`
418
- });
419
303
  const breakpoint = getDevice(window.innerWidth);
420
304
  const lineH = element?.children[0]?.lineHeight;
421
305
  const selectedLineHeight = getBreakpointLineSpacing(lineH, breakpoint);
422
306
  switch (element.type) {
423
307
  case "headingOne":
424
308
  return /*#__PURE__*/_jsxs("h1", {
425
- ...commonHeadingProps(),
309
+ ...attributes,
310
+ ...element.attr,
311
+ className: `edt-headings content-editable ${isEmpty ? "empty" : ""}`,
426
312
  placeholder: translation("Heading 1"),
427
313
  children: [children, /*#__PURE__*/_jsx("span", {
428
314
  contentEditable: false
@@ -430,7 +316,9 @@ export const getBlock = props => {
430
316
  });
431
317
  case "headingTwo":
432
318
  return /*#__PURE__*/_jsxs("h2", {
433
- ...commonHeadingProps(),
319
+ ...attributes,
320
+ ...element.attr,
321
+ className: `edt-headings content-editable ${isEmpty ? "empty" : ""}`,
434
322
  placeholder: translation("Heading 2"),
435
323
  children: [children, /*#__PURE__*/_jsx("span", {
436
324
  contentEditable: false
@@ -438,7 +326,9 @@ export const getBlock = props => {
438
326
  });
439
327
  case "headingThree":
440
328
  return /*#__PURE__*/_jsxs("h3", {
441
- ...commonHeadingProps(),
329
+ ...attributes,
330
+ ...element.attr,
331
+ className: `edt-headings content-editable ${isEmpty ? "empty" : ""}`,
442
332
  placeholder: translation("Heading 3"),
443
333
  children: [children, /*#__PURE__*/_jsx("span", {
444
334
  contentEditable: false
@@ -446,7 +336,9 @@ export const getBlock = props => {
446
336
  });
447
337
  case "headingFour":
448
338
  return /*#__PURE__*/_jsxs("h4", {
449
- ...commonHeadingProps(),
339
+ ...attributes,
340
+ ...element.attr,
341
+ className: `edt-headings content-editable ${isEmpty ? "empty" : ""}`,
450
342
  placeholder: translation("Heading 4"),
451
343
  children: [children, /*#__PURE__*/_jsx("span", {
452
344
  contentEditable: false
@@ -454,7 +346,9 @@ export const getBlock = props => {
454
346
  });
455
347
  case "headingFive":
456
348
  return /*#__PURE__*/_jsxs("h5", {
457
- ...commonHeadingProps(),
349
+ ...attributes,
350
+ ...element.attr,
351
+ className: `edt-headings content-editable ${isEmpty ? "empty" : ""}`,
458
352
  placeholder: translation("Heading 5"),
459
353
  children: [children, /*#__PURE__*/_jsx("span", {
460
354
  contentEditable: false
@@ -462,30 +356,14 @@ export const getBlock = props => {
462
356
  });
463
357
  case "headingSix":
464
358
  return /*#__PURE__*/_jsxs("h6", {
465
- ...commonHeadingProps(),
359
+ ...attributes,
360
+ ...element.attr,
361
+ className: `edt-headings content-editable ${isEmpty ? "empty" : ""}`,
466
362
  placeholder: translation("Heading 6"),
467
363
  children: [children, /*#__PURE__*/_jsx("span", {
468
364
  contentEditable: false
469
365
  })]
470
366
  });
471
- case "paragraphOne":
472
- return /*#__PURE__*/_jsx("p", {
473
- ...commonParaProps("para1"),
474
- placeholder: "Paragraph 1",
475
- children: children
476
- });
477
- case "paragraphTwo":
478
- return /*#__PURE__*/_jsx("p", {
479
- ...commonParaProps("para2"),
480
- placeholder: "Paragraph 2",
481
- children: children
482
- });
483
- case "paragraphThree":
484
- return /*#__PURE__*/_jsx("p", {
485
- ...commonParaProps("para3"),
486
- placeholder: "Paragraph 3",
487
- children: children
488
- });
489
367
  case "blockquote":
490
368
  return /*#__PURE__*/_jsx("blockquote", {
491
369
  ...attributes,
@@ -794,10 +672,8 @@ export const getQueryStrings = urlString => {
794
672
  const newUrl = new URL(urlString);
795
673
  var youCode = newUrl.searchParams.get("v");
796
674
  if (!youCode) {
797
- const parts = newUrl.pathname.split("/");
798
- youCode = parts[parts.length - 1]; // video ID
675
+ youCode = newUrl.pathname.replace("/", "");
799
676
  }
800
-
801
677
  return `https://www.youtube.com/embed/${youCode}`;
802
678
  } else {
803
679
  return urlString;
@@ -1,13 +1,6 @@
1
1
  import { Transforms } from "slate";
2
2
  import insertNewLine from "./insertNewLine";
3
3
  import { getSelectedText } from "./helper";
4
- import { isMobileWindow } from "../helper";
5
- const focusAccordion = (editor, upPath) => {
6
- Transforms.select(editor, {
7
- path: upPath,
8
- offset: 0
9
- });
10
- };
11
4
  export const insertAccordion = (editor, path) => {
12
5
  try {
13
6
  const selectedText = getSelectedText(editor);
@@ -43,14 +36,11 @@ export const insertAccordion = (editor, path) => {
43
36
  // get title index
44
37
  const summaryIndex = upPath.length - 3;
45
38
  upPath[summaryIndex] = upPath[summaryIndex] === 0 ? 0 : upPath[summaryIndex] - 1;
46
-
47
39
  // select accordion title by default
48
- if (isMobileWindow()) {
49
- // timeout to resolve focus issue in mobile
50
- setTimeout(() => focusAccordion(editor, upPath), 0);
51
- } else {
52
- focusAccordion(editor, upPath);
53
- }
40
+ Transforms.select(editor, {
41
+ path: upPath,
42
+ offset: 0
43
+ });
54
44
  insertNewLine(editor);
55
45
  } catch (err) {
56
46
  console.log(err);
@@ -1,5 +1,6 @@
1
1
  import { Path, Transforms } from "slate";
2
2
  import insertNewLine from "./insertNewLine";
3
+ import { windowVar } from "./helper";
3
4
  import { getCurrentElementText } from "../plugins/withHTML";
4
5
  export const insertButton = editor => {
5
6
  const button = {
@@ -10,7 +11,22 @@ export const insertButton = editor => {
10
11
  buttonLink: {
11
12
  linkType: "webAddress"
12
13
  },
13
- iconPosition: "start"
14
+ iconPosition: "start",
15
+ bgColor: "#2563EB",
16
+ textColor: "#FFF",
17
+ borderRadius: {
18
+ topLeft: 30,
19
+ topRight: 30,
20
+ bottomLeft: 30,
21
+ bottomRight: 30
22
+ },
23
+ bannerSpacing: {
24
+ left: 16,
25
+ top: 8,
26
+ right: 16,
27
+ bottom: 8
28
+ },
29
+ ...(windowVar.lastButtonProps || {})
14
30
  };
15
31
  const hasText = getCurrentElementText(editor);
16
32
  const insertPath = hasText ? Path.next(Path.parent(editor?.selection.focus.path)) : editor?.selection.focus.path;
@@ -1,10 +1,9 @@
1
- import { useRef, useState } from "react";
1
+ import { useState } from "react";
2
2
  const useTableResize = ({
3
3
  parentDOM,
4
4
  size: defaultSize,
5
5
  onDone,
6
- minMaxProps = {},
7
- isMobile
6
+ minMaxProps = {}
8
7
  }) => {
9
8
  const {
10
9
  width
@@ -19,10 +18,6 @@ const useTableResize = ({
19
18
  });
20
19
  const [resizing, setResizing] = useState(false);
21
20
  const [isDone, setIsDone] = useState(0);
22
- const lastTouch = useRef({
23
- x: 0,
24
- y: 0
25
- });
26
21
  const onLoad = defaultSize => {
27
22
  setSize({
28
23
  widthInPercent: 100,
@@ -30,64 +25,29 @@ const useTableResize = ({
30
25
  ...defaultSize
31
26
  });
32
27
  };
33
- const handleEventListeners = type => {
34
- const listener = type === "add" ? document.addEventListener : document.removeEventListener;
35
- const onMoveListener = isMobile ? "touchmove" : "pointermove";
36
- const onEndListener = isMobile ? "touchend" : "pointerup";
37
- listener(onMoveListener, onMouseMove);
38
- listener(onEndListener, onMouseUp);
39
- };
40
- const updateLastTouch = ({
41
- clientX,
42
- clientY
43
- }) => {
44
- lastTouch.current.x = clientX;
45
- lastTouch.current.y = clientY;
46
- };
47
28
  const onMouseDown = e => {
48
- if (isMobile) {
49
- updateLastTouch(e.touches[0]);
50
- } else {
51
- e.preventDefault();
52
- }
53
- handleEventListeners("add");
29
+ e.preventDefault();
30
+ document.addEventListener("pointermove", onMouseMove);
31
+ document.addEventListener("pointerup", onMouseUp);
54
32
  setResizing(true);
55
33
  setIsDone(0);
56
34
  };
57
35
  const onMouseUp = () => {
58
- handleEventListeners("remove");
36
+ document.removeEventListener("pointermove", onMouseMove);
37
+ document.removeEventListener("pointerup", onMouseUp);
59
38
  setResizing(false);
60
39
  setIsDone(1);
61
40
  };
62
41
  const onMouseMove = e => {
63
- let {
64
- movementX,
65
- movementY
66
- } = e || {};
67
- if (e.type === "touchmove") {
68
- // for mobile
69
- const {
70
- x,
71
- y
72
- } = lastTouch.current || {};
73
- const touches = e.touches[0];
74
- const {
75
- clientX,
76
- clientY
77
- } = touches;
78
- movementX = clientX - x;
79
- movementY = clientY - y;
80
- updateLastTouch(touches);
81
- }
82
42
  const {
83
43
  minWidth
84
44
  } = minMaxProps || {};
85
45
  setSize(currentSize => {
86
46
  const width = currentSize?.width || parentDOM?.clientWidth;
87
- const calcWidth = width + movementX;
47
+ const calcWidth = width + e.movementX;
88
48
  return {
89
49
  width: minWidth && calcWidth < minWidth ? minWidth : calcWidth,
90
- height: currentSize.height + movementY,
50
+ height: currentSize.height + e.movementY,
91
51
  widthInPercent: calcWidth / width * 100
92
52
  };
93
53
  });
@@ -82,8 +82,7 @@ const splitInlineStyleRanges = (text, inlineStyleRanges, data) => {
82
82
  };
83
83
  export const draftToSlate = props => {
84
84
  const {
85
- data,
86
- needLayout
85
+ data
87
86
  } = props;
88
87
  if (data?.blocks && data?.blocks?.length > 0) {
89
88
  const converted = data?.blocks?.reduce((a, b) => {
@@ -105,7 +104,7 @@ export const draftToSlate = props => {
105
104
  return data;
106
105
  } else {
107
106
  return [{
108
- type: needLayout ? "title" : "paragraph",
107
+ type: "paragraph",
109
108
  children: [{
110
109
  text: ""
111
110
  }]
@@ -1,11 +1,10 @@
1
- import { Editor, Transforms, Element, Node, Path, Range, Point } from "slate";
1
+ import { Editor, Transforms, Element, Node, Path, Range } from "slate";
2
2
  import { toggleBlock } from "./SlateUtilityFunctions";
3
3
  import insertNewLine from "./insertNewLine";
4
4
  import { insertAccordion } from "./accordion";
5
- import { getNodeWithType, isListItem } from "./helper";
5
+ import { isListItem } from "./helper";
6
6
  import RnDCtrlCmds from "./RnD/RnDCtrlCmds";
7
7
  import EDITORCMDS from "../common/EditorCmds";
8
- import { ReactEditor } from "slate-react";
9
8
  const HOTKEYS = {
10
9
  b: "bold",
11
10
  i: "italic",
@@ -184,20 +183,6 @@ const checkListEnterEvent = (editor, type) => {
184
183
  insertNewLine(editor);
185
184
  }
186
185
  };
187
- const removeAccordion = (editor, accordionPath) => {
188
- Transforms.removeNodes(editor, {
189
- at: accordionPath
190
- });
191
- Transforms.insertNodes(editor, {
192
- type: "paragraph",
193
- children: [{
194
- text: ""
195
- }]
196
- }, {
197
- at: accordionPath,
198
- select: true
199
- });
200
- };
201
186
  export const enterEvent = (e, editor, isMobile) => {
202
187
  try {
203
188
  const ele = isListItem(editor);
@@ -240,7 +225,9 @@ export const enterEvent = (e, editor, isMobile) => {
240
225
  e.preventDefault();
241
226
  if (!text) {
242
227
  const accordionIndex = ele[1].slice(0, Math.max(ele[1].length - 1));
243
- removeAccordion(editor, accordionIndex);
228
+ Transforms.removeNodes(editor, {
229
+ at: accordionIndex
230
+ });
244
231
  } else {
245
232
  const nextPath = Path.next(Path.parent(ele[1]));
246
233
  insertAccordion(editor, nextPath);
@@ -342,37 +329,6 @@ export const enterEvent = (e, editor, isMobile) => {
342
329
  console.log(err);
343
330
  }
344
331
  };
345
- export const handleAccordionOnBackspace = (e, editor) => {
346
- try {
347
- let isAccordion = false;
348
- const [accordionDetails] = getNodeWithType(editor, "accordion-details");
349
- const [accordionDetailsNode] = accordionDetails || [];
350
- if (accordionDetailsNode) {
351
- const dom = ReactEditor.toDOMNode(editor, accordionDetailsNode);
352
- if (dom?.parentElement) {
353
- dom.parentElement.style.display = "block";
354
- }
355
- }
356
- const [accordionSummary] = getNodeWithType(editor, "accordion-summary");
357
- const [accordionTitle, accordionTitlePath] = accordionSummary || [];
358
- if (accordionTitle) {
359
- // no selection
360
- if (Range.isCollapsed(editor.selection)) {
361
- const start = Editor.start(editor, accordionTitlePath);
362
- const isCursorAtStart = Point.equals(editor.selection.focus, start);
363
- if (isCursorAtStart) {
364
- e.preventDefault();
365
- const parentPath = Path.parent(accordionTitlePath);
366
- removeAccordion(editor, parentPath);
367
- isAccordion = true;
368
- }
369
- }
370
- }
371
- return isAccordion;
372
- } catch (err) {
373
- console.log(err);
374
- }
375
- };
376
332
  export const upDownArrowKeyEvents = (e, editor) => {
377
333
  try {
378
334
  const {
@@ -392,7 +348,7 @@ export const upDownArrowKeyEvents = (e, editor) => {
392
348
  }
393
349
  Transforms.move(editor, {
394
350
  distance: 0,
395
- unit: "offset",
351
+ unit: 'offset',
396
352
  reverse: false
397
353
  });
398
354
  Transforms.select(editor, {