@flozy/editor 7.0.5 → 7.0.7

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 (47) hide show
  1. package/dist/Editor/CommonEditor.js +2 -5
  2. package/dist/Editor/Editor.css +1 -1
  3. package/dist/Editor/Elements/AI/PopoverAIInput.js +12 -2
  4. package/dist/Editor/Elements/Button/EditorButton.js +0 -1
  5. package/dist/Editor/Elements/DataView/DataView.js +3 -4
  6. package/dist/Editor/Elements/DataView/Layouts/DataTypes/NumberType.js +1 -5
  7. package/dist/Editor/Elements/DataView/Layouts/DataTypes/TextType.js +1 -5
  8. package/dist/Editor/Elements/DataView/Layouts/FilterView.js +19 -23
  9. package/dist/Editor/Elements/Form/Form.js +0 -1
  10. package/dist/Editor/Elements/FreeGrid/styles.js +0 -1
  11. package/dist/Editor/Elements/List/CheckList.js +1 -2
  12. package/dist/Editor/Elements/Search/SearchAttachment.js +0 -1
  13. package/dist/Editor/Elements/Search/SearchList.js +1 -8
  14. package/dist/Editor/Elements/SimpleText/index.js +1 -8
  15. package/dist/Editor/Elements/SimpleText/style.js +1 -5
  16. package/dist/Editor/Elements/Table/Table.js +15 -15
  17. package/dist/Editor/Elements/Table/TableCell.js +9 -14
  18. package/dist/Editor/MiniEditor.js +2 -4
  19. package/dist/Editor/Toolbar/PopupTool/AddTemplates.js +28 -37
  20. package/dist/Editor/Toolbar/PopupTool/MiniTextFormat/SelectAlignment.js +1 -3
  21. package/dist/Editor/Toolbar/PopupTool/MiniTextFormat/SelectFontSize.js +1 -1
  22. package/dist/Editor/Toolbar/PopupTool/MiniTextFormat/SelectList.js +1 -3
  23. package/dist/Editor/Toolbar/PopupTool/MiniTextFormat/SelectTypography.js +8 -3
  24. package/dist/Editor/Toolbar/PopupTool/MiniTextFormat/index.js +3 -9
  25. package/dist/Editor/Toolbar/PopupTool/TemplateCard.js +1 -1
  26. package/dist/Editor/Toolbar/PopupTool/TextFormat.js +0 -45
  27. package/dist/Editor/Toolbar/PopupTool/index.js +0 -2
  28. package/dist/Editor/common/ImageSelector/Options/Upload.js +1 -1
  29. package/dist/Editor/common/ImageSelector/UploadStyles.js +1 -2
  30. package/dist/Editor/common/MentionsPopup/index.js +1 -0
  31. package/dist/Editor/common/RnD/ElementSettings/styles.js +0 -1
  32. package/dist/Editor/common/RnD/SwitchViewport/SwitchViewport.js +0 -6
  33. package/dist/Editor/common/Section/index.js +2 -2
  34. package/dist/Editor/common/StyleBuilder/fieldTypes/index.js +1 -3
  35. package/dist/Editor/common/StyleBuilder/pageSettingsStyle.js +0 -4
  36. package/dist/Editor/commonStyle.js +0 -5
  37. package/dist/Editor/helper/theme.js +1 -24
  38. package/dist/Editor/hooks/useMouseMove.js +2 -5
  39. package/dist/Editor/plugins/withHTML.js +1 -7
  40. package/dist/Editor/utils/SlateUtilityFunctions.js +7 -23
  41. package/dist/Editor/utils/customHooks/useTableResize.js +1 -2
  42. package/dist/Editor/utils/helper.js +0 -41
  43. package/dist/Editor/utils/pageSettings.js +2 -14
  44. package/dist/Editor/utils/table.js +0 -21
  45. package/package.json +1 -1
  46. package/dist/Editor/common/StyleBuilder/fieldTypes/lineSpacing.js +0 -79
  47. package/dist/Editor/helper/ensureWrappedVariables.js +0 -28
@@ -26,7 +26,7 @@ import editorStyles from "./Styles/EditorStyles";
26
26
  import DragAndDrop from "./common/DnD";
27
27
  import Section from "./common/Section";
28
28
  import decorators from "./utils/Decorators";
29
- import { getBreakpointLineSpacing, getTRBLBreakPoints } from "./helper/theme";
29
+ import { getTRBLBreakPoints } from "./helper/theme";
30
30
  import { getInitialValue, handleInsertLastElement, isFreeGrid, isFreeGridFragment, isRestrictedNode, outsideEditorClickLabel } from "./utils/helper";
31
31
  import useWindowResize from "./hooks/useWindowResize";
32
32
  import PopoverAIInput from "./Elements/AI/PopoverAIInput";
@@ -141,8 +141,7 @@ const CommonEditor = /*#__PURE__*/forwardRef((props, ref) => {
141
141
  pageColor,
142
142
  color: pageTextColor,
143
143
  pageWidth,
144
- maxWidth: pageMaxWidth,
145
- lineHeight
144
+ maxWidth: pageMaxWidth
146
145
  } = pageSt?.pageProps || {
147
146
  bannerSpacing: {
148
147
  left: 0,
@@ -333,7 +332,6 @@ const CommonEditor = /*#__PURE__*/forwardRef((props, ref) => {
333
332
  onDrawerOpen: onDrawerOpen,
334
333
  ICON_API: "https://assets.agenciflow.com"
335
334
  };
336
- const lineH = getBreakpointLineSpacing(lineHeight, breakpoint);
337
335
  const renderElement = useCallback(props => {
338
336
  return /*#__PURE__*/_jsx(Element, {
339
337
  ...props,
@@ -536,7 +534,6 @@ const CommonEditor = /*#__PURE__*/forwardRef((props, ref) => {
536
534
  padding: {
537
535
  ...getTRBLBreakPoints(bannerSpacing)
538
536
  },
539
- lineHeight: lineH,
540
537
  width: !pageWidth || pageWidth === "fixed" ? fixedWidth : fullWidth,
541
538
  height: viewport.h ? `${viewport.h}px` : `100%`,
542
539
  alignSelf: "center",
@@ -995,7 +995,7 @@ blockquote {
995
995
 
996
996
  .sliderInput {
997
997
  width: 66px !important;
998
- padding: 2px 0px 2px 4px;
998
+ padding: 2px 10px;
999
999
  margin-left: 18px;
1000
1000
  box-shadow: 0px 4px 16px 0px #0000000d;
1001
1001
  border: 1px solid #6f6f6f33;
@@ -6,7 +6,7 @@ import AIInput from "./AIInput";
6
6
  import { ReactEditor, useSlate } from "slate-react";
7
7
  import { Node, Range, Transforms } from "slate";
8
8
  import { MODES } from "./helper";
9
- import { getSelectedText, getSlateDom, viewSlateSelection } from "../../utils/helper";
9
+ import { getSelectedText, getSlateDom } from "../../utils/helper";
10
10
  import { VoiceToText } from "./VoiceToText";
11
11
  import deserialize from "../../helper/deserialize";
12
12
  import useEditorScroll from "../../hooks/useEditorScroll";
@@ -286,7 +286,17 @@ function PopoverAIInput({
286
286
  };
287
287
  useEffect(() => {
288
288
  if (openAI && getSelectedText(editor).trim()) {
289
- viewSlateSelection();
289
+ const customSelection = document.querySelectorAll(".slate-highlight");
290
+ const selectionBg = "rgba(35, 131, 226, 0.35)";
291
+ if (customSelection?.length) {
292
+ customSelection?.forEach(el => el.style.background = selectionBg);
293
+
294
+ // if ai is opened, remove the window selection class and open then slate selection, To resolve: focussing on the ai input removes window selection automatically
295
+ const selection = window.getSelection();
296
+ if (selection) {
297
+ selection.removeAllRanges(); // Clears the selection
298
+ }
299
+ }
290
300
  }
291
301
  }, [editor.selection, openAI]);
292
302
  return /*#__PURE__*/_jsxs("div", {
@@ -269,7 +269,6 @@ const EditorButton = props => {
269
269
  display: "inline-flex",
270
270
  alignItems: "center",
271
271
  position: "relative",
272
- lineHeight: 1.43,
273
272
  "& .element-toolbar": {
274
273
  display: "none"
275
274
  },
@@ -1,6 +1,6 @@
1
1
  import React from "react";
2
2
  import { Node, Path, Transforms } from "slate";
3
- import { ReactEditor, useSlate } from "slate-react";
3
+ import { ReactEditor, useSlateStatic } from "slate-react";
4
4
  import { Box, useTheme } from "@mui/material";
5
5
  import { DataViewProvider } from "./Providers/DataViewProvider";
6
6
  import useDataViewStyles from "./styles";
@@ -15,7 +15,7 @@ const DataView = props => {
15
15
  theme: appTheme
16
16
  } = useEditorContext();
17
17
  const theme = useTheme();
18
- const editor = useSlate();
18
+ const editor = useSlateStatic();
19
19
  const {
20
20
  attributes,
21
21
  children,
@@ -113,8 +113,7 @@ const DataView = props => {
113
113
  onDuplicate: onDuplicate,
114
114
  readOnly: readOnly,
115
115
  title: title,
116
- onTitleChange: onTitleChange,
117
- path: path
116
+ onTitleChange: onTitleChange
118
117
  }), /*#__PURE__*/_jsx(LayoutView, {
119
118
  readOnly: readOnly,
120
119
  children: children
@@ -1,7 +1,6 @@
1
1
  import React from "react";
2
2
  import { TextField } from "@mui/material";
3
3
  import { useDataView } from "../../Providers/DataViewProvider";
4
- import { focusDynamicTableInput } from "../../../../utils/helper";
5
4
  import { jsx as _jsx } from "react/jsx-runtime";
6
5
  const NumberType = props => {
7
6
  const {
@@ -17,7 +16,6 @@ const NumberType = props => {
17
16
  onChange(rowIndex, {
18
17
  [property]: e?.target?.value
19
18
  });
20
- focusDynamicTableInput(e);
21
19
  };
22
20
  return /*#__PURE__*/_jsx(TextField, {
23
21
  type: "number",
@@ -26,9 +24,7 @@ const NumberType = props => {
26
24
  value: value,
27
25
  size: "small",
28
26
  onChange: handleChange,
29
- disabled: readOnly,
30
- id: `tv-number-input-${rowIndex}-${property}` // * should be unique
27
+ disabled: readOnly
31
28
  });
32
29
  };
33
-
34
30
  export default NumberType;
@@ -1,7 +1,6 @@
1
1
  import React from "react";
2
2
  import { TextField } from "@mui/material";
3
3
  import { useDataView } from "../../Providers/DataViewProvider";
4
- import { focusDynamicTableInput } from "../../../../utils/helper";
5
4
  import { jsx as _jsx } from "react/jsx-runtime";
6
5
  const TextType = props => {
7
6
  const {
@@ -17,7 +16,6 @@ const TextType = props => {
17
16
  onChange(rowIndex, {
18
17
  [property]: e?.target?.value
19
18
  });
20
- focusDynamicTableInput(e);
21
19
  };
22
20
  const formatValue = () => {
23
21
  if (typeof value === "string") {
@@ -32,9 +30,7 @@ const TextType = props => {
32
30
  value: formatValue(value),
33
31
  size: "small",
34
32
  onChange: handleChange,
35
- disabled: readOnly,
36
- id: `tv-text-input-${rowIndex}-${property}` // * should be unique
33
+ disabled: readOnly
37
34
  });
38
35
  };
39
-
40
36
  export default TextType;
@@ -5,7 +5,6 @@ import FilterSort from "./FilterSort";
5
5
  import MoreHorizIcon from "@mui/icons-material/MoreHoriz";
6
6
  import Icon from "../../../common/Icon";
7
7
  import { useEditorContext } from "../../../hooks/useMouseMove";
8
- import { focusDynamicTableInput } from "../../../utils/helper";
9
8
  import { jsx as _jsx } from "react/jsx-runtime";
10
9
  import { jsxs as _jsxs } from "react/jsx-runtime";
11
10
  const FilterView = props => {
@@ -16,8 +15,7 @@ const FilterView = props => {
16
15
  onEnter,
17
16
  readOnly,
18
17
  title,
19
- onTitleChange,
20
- path
18
+ onTitleChange
21
19
  } = props;
22
20
  const {
23
21
  sort,
@@ -72,7 +70,6 @@ const FilterView = props => {
72
70
  };
73
71
  const handleTitleChange = e => {
74
72
  onTitleChange(e?.target?.value);
75
- focusDynamicTableInput(e);
76
73
  };
77
74
  const handleEnter = e => {
78
75
  if (e?.key === "Enter") {
@@ -99,25 +96,24 @@ const FilterView = props => {
99
96
  },
100
97
  value: title,
101
98
  onChange: handleTitleChange,
102
- onKeyUp: handleEnter,
103
- id: `tv-title-input-${path.join("|")}`
99
+ onKeyUp: handleEnter
104
100
  }) : title || "Untitled"
105
101
  }), /*#__PURE__*/_jsxs(Box, {
106
102
  className: "tv-fi-wrpr",
107
103
  sx: {
108
- alignItems: "center"
104
+ alignItems: 'center'
109
105
  },
110
106
  children: [/*#__PURE__*/_jsxs(Box, {
111
107
  className: `tv-sb mr ${toggle ? "open" : ""}`,
112
108
  sx: {
113
- minHeight: "32px"
109
+ minHeight: '32px'
114
110
  },
115
111
  children: [/*#__PURE__*/_jsx(IconButton, {
116
112
  type: "button",
117
113
  sx: {
118
- "& svg": {
119
- width: "14px",
120
- height: "14px"
114
+ '& svg': {
115
+ width: '14px',
116
+ height: '14px'
121
117
  }
122
118
  },
123
119
  "aria-label": "search",
@@ -141,12 +137,12 @@ const FilterView = props => {
141
137
  className: ` ${sort?.length > 0 ? "active" : ""}`,
142
138
  onClick: handleSortClick,
143
139
  sx: {
144
- "& svg": {
140
+ '& svg': {
145
141
  strokeWidth: 1.2
146
142
  }
147
143
  },
148
144
  children: /*#__PURE__*/_jsx(Icon, {
149
- icon: "sortBy"
145
+ icon: 'sortBy'
150
146
  })
151
147
  }), /*#__PURE__*/_jsx(FilterSort, {
152
148
  open: open,
@@ -156,7 +152,7 @@ const FilterView = props => {
156
152
  }), !readOnly ? /*#__PURE__*/_jsx(IconButton, {
157
153
  className: "mr",
158
154
  sx: {
159
- "& svg": {
155
+ '& svg': {
160
156
  fill: theme?.palette?.editor?.tv_stroke
161
157
  }
162
158
  },
@@ -166,7 +162,7 @@ const FilterView = props => {
166
162
  className: "mr",
167
163
  onClick: handleDeleteRow,
168
164
  children: /*#__PURE__*/_jsx(Icon, {
169
- icon: "trashIcon"
165
+ icon: 'trashIcon'
170
166
  })
171
167
  }) : null, !readOnly ? /*#__PURE__*/_jsxs(Menu, {
172
168
  sx: classes.basicMenu,
@@ -189,24 +185,24 @@ const FilterView = props => {
189
185
  onClick: onMenuClick("Duplicate"),
190
186
  children: [" ", /*#__PURE__*/_jsx(Box, {
191
187
  sx: {
192
- marginRight: "5px",
193
- display: " flex",
194
- alignItems: "center"
188
+ marginRight: '5px',
189
+ display: ' flex',
190
+ alignItems: 'center'
195
191
  },
196
192
  children: /*#__PURE__*/_jsx(Icon, {
197
- icon: "duplicateIcon"
193
+ icon: 'duplicateIcon'
198
194
  })
199
195
  }), "Duplicate"]
200
196
  }), /*#__PURE__*/_jsxs(MenuItem, {
201
197
  onClick: onMenuClick("Delete"),
202
198
  children: [" ", /*#__PURE__*/_jsx(Box, {
203
199
  sx: {
204
- marginRight: "5px",
205
- display: " flex",
206
- alignItems: "center"
200
+ marginRight: '5px',
201
+ display: ' flex',
202
+ alignItems: 'center'
207
203
  },
208
204
  children: /*#__PURE__*/_jsx(Icon, {
209
- icon: "trashIcon"
205
+ icon: 'trashIcon'
210
206
  })
211
207
  }), "Delete"]
212
208
  })]
@@ -402,7 +402,6 @@ const Form = props => {
402
402
  borderStyle: borderStyle || "solid",
403
403
  background: bgColor || "transparent",
404
404
  position: "relative",
405
- lineHeight: 1.43,
406
405
  ...formSX
407
406
  },
408
407
  ref: formEle,
@@ -171,7 +171,6 @@ const useFreeGridStyles = ({
171
171
  height: "100%",
172
172
  "& .signature-container": {
173
173
  height: "100%",
174
- LineHeight: 1.43,
175
174
  "& .signature-btn-container": {
176
175
  height: "100%",
177
176
  display: "flex",
@@ -39,8 +39,7 @@ const CheckList = ({
39
39
  display: "flex",
40
40
  justifyContent: "center",
41
41
  alignItems: "center",
42
- ...(style || {}),
43
- lineHeight: 1.43
42
+ ...(style || {})
44
43
  },
45
44
  children: [/*#__PURE__*/_jsxs("div", {
46
45
  contentEditable: false,
@@ -49,7 +49,6 @@ const SearchAttachment = props => {
49
49
  background: `${theme?.palette?.containers?.slashBrainCardBg} !important`,
50
50
  cursor: 'pointer',
51
51
  margin: '4px 0px',
52
- lineHeight: 1.43,
53
52
  "&.MuiPaper-root.MuiPaper-rounded": {
54
53
  borderRadius: "7px !important",
55
54
  paddingTop: '0px !important'
@@ -185,9 +185,6 @@ const SearchAndDocList = ({
185
185
  gap: 1,
186
186
  children: [/*#__PURE__*/_jsx(Grid, {
187
187
  item: true,
188
- sx: {
189
- maxWidth: 'calc(100% - 45px)'
190
- },
191
188
  children: /*#__PURE__*/_jsxs(Grid, {
192
189
  container: true,
193
190
  alignItems: "center",
@@ -210,9 +207,6 @@ const SearchAndDocList = ({
210
207
  })
211
208
  }), /*#__PURE__*/_jsx(Grid, {
212
209
  item: true,
213
- sx: {
214
- maxWidth: '100%'
215
- },
216
210
  children: /*#__PURE__*/_jsx(Typography, {
217
211
  sx: {
218
212
  fontSize: "12px",
@@ -225,8 +219,7 @@ const SearchAndDocList = ({
225
219
  maxWidth: '230px',
226
220
  textAlign: 'left',
227
221
  '@media only screen and (min-width: 350px) and (max-width: 899px)': {
228
- maxWidth: '100%',
229
- width: '100%'
222
+ maxWidth: '100%'
230
223
  }
231
224
  },
232
225
  children: title
@@ -5,7 +5,6 @@ import { Box } from "@mui/material";
5
5
  import { isTextSelected } from "../../utils/helper";
6
6
  import { useEditorContext } from "../../hooks/useMouseMove";
7
7
  import SimpleTextStyle from "./style";
8
- import { getBreakpointLineSpacing } from "../../helper/theme";
9
8
  import { jsx as _jsx } from "react/jsx-runtime";
10
9
  import { Fragment as _Fragment } from "react/jsx-runtime";
11
10
  import { jsxs as _jsxs } from "react/jsx-runtime";
@@ -29,14 +28,8 @@ const SimpleText = props => {
29
28
  } = customProps;
30
29
  // const { element: pageSt } = getPageSettings(editor) || {};
31
30
  // const { pageColor } = pageSt?.pageProps || {};
32
- const {
33
- activeBreakPoint
34
- } = useEditorContext();
35
- const lineHeight = element?.children[0]?.lineHeight;
36
- const lineH = getBreakpointLineSpacing(lineHeight, activeBreakPoint);
37
31
  const classes = SimpleTextStyle({
38
- pageColor: "#FFFFFF",
39
- lineHeight: lineH
32
+ pageColor: "#FFFFFF"
40
33
  });
41
34
  const selected = useSelected();
42
35
  const path = ReactEditor.findPath(editor, element);
@@ -1,12 +1,10 @@
1
1
  import { invertColor } from "../../helper";
2
2
  const SimpleTextStyle = ({
3
- pageColor,
4
- lineHeight
3
+ pageColor
5
4
  }) => ({
6
5
  root: {
7
6
  position: "relative",
8
7
  padding: "0px",
9
- lineHeight: lineHeight,
10
8
  "&.dataView": {
11
9
  "& .placeholder-simple-text": {
12
10
  opacity: 0
@@ -35,8 +33,6 @@ const SimpleTextStyle = ({
35
33
  height: "24px",
36
34
  overflow: "hidden",
37
35
  fontSize: "14px",
38
- display: 'inline-flex',
39
- alignItems: 'center',
40
36
  "& .bg-pad-sl": {
41
37
  padding: "2px 4px 2px 4px",
42
38
  background: "transparent",
@@ -2,7 +2,7 @@ import React, { useEffect, useRef, useState } from "react";
2
2
  import { Editor, Transforms } from "slate";
3
3
  import { ReactEditor, useSelected, useSlateStatic } from "slate-react";
4
4
  import { Box, IconButton, Tooltip, Table as TableComp, TableBody, useTheme, Popper, ClickAwayListener } from "@mui/material";
5
- import { TableUtil, getTableColumns, getTableRows } from "../../utils/table";
5
+ import { TableUtil } from "../../utils/table";
6
6
  import TablePopup from "./TablePopup";
7
7
  import { useEditorContext, useEditorSelection } from "../../hooks/useMouseMove";
8
8
  import TableStyles from "./Styles";
@@ -30,14 +30,16 @@ const ToolTableComponent = props => {
30
30
  const {
31
31
  updateTableSelection
32
32
  } = useTable();
33
- return /*#__PURE__*/_jsx(TableTool, {
34
- theme: editorTheme,
35
- handleToolAction: (type, option) => {
36
- handleAction(type, option);
37
- if (type === "duplicate") {
38
- updateTableSelection(getDefaultTableSelection());
33
+ return /*#__PURE__*/_jsx("div", {
34
+ children: /*#__PURE__*/_jsx(TableTool, {
35
+ theme: editorTheme,
36
+ handleToolAction: (type, option) => {
37
+ handleAction(type, option);
38
+ if (type === "duplicate") {
39
+ updateTableSelection(getDefaultTableSelection());
40
+ }
39
41
  }
40
- }
42
+ })
41
43
  });
42
44
  };
43
45
  const MoreTableSettings = props => {
@@ -72,11 +74,9 @@ const MoreTableSettings = props => {
72
74
  placement: "bottom-start",
73
75
  children: /*#__PURE__*/_jsx(ClickAwayListener, {
74
76
  onClickAway: () => setExpandTools(false),
75
- children: /*#__PURE__*/_jsx("div", {
76
- children: /*#__PURE__*/_jsx(ToolTableComponent, {
77
- handleAction: handleAction,
78
- editorTheme: editorTheme
79
- })
77
+ children: /*#__PURE__*/_jsx(ToolTableComponent, {
78
+ handleAction: handleAction,
79
+ editorTheme: editorTheme
80
80
  })
81
81
  })
82
82
  });
@@ -206,7 +206,7 @@ const Table = props => {
206
206
  }
207
207
  }, theme);
208
208
  const addRow = () => {
209
- const lastRow = getTableRows(element) - 1;
209
+ const lastRow = element?.rows - 1;
210
210
  const firstCol = 0;
211
211
  const lastRowPath = [...path, lastRow, firstCol];
212
212
  const position = Editor.start(editor, lastRowPath);
@@ -221,7 +221,7 @@ const Table = props => {
221
221
  Transforms.deselect(editor);
222
222
  };
223
223
  const addCol = () => {
224
- const lastCol = getTableColumns(element) - 1;
224
+ const lastCol = element?.columns - 1;
225
225
  const firstRow = 0;
226
226
  const lastColumnPath = [...path, firstRow, lastCol];
227
227
  const position = Editor.start(editor, lastColumnPath);
@@ -50,7 +50,6 @@ const TableCell = props => {
50
50
  const {
51
51
  readOnly
52
52
  } = customProps;
53
- const isMobile = window.matchMedia("(max-width: 899px)")?.matches || false;
54
53
  const {
55
54
  bgColor,
56
55
  borderColor,
@@ -248,24 +247,20 @@ const TableCell = props => {
248
247
  isDragging: false
249
248
  });
250
249
  };
251
- const eventProps = isMobile ? {
252
- // mobile events for selection
253
- onTouchStart: onMouseDownInCell,
254
- onTouchMove: handleTouchMove,
255
- onTouchEnd: handleTouchEnd
256
- } : {
257
- onMouseEnter: () => onMouseEnter(path),
258
- onMouseLeave,
259
- onMouseDown: onMouseDownInCell,
260
- onMouseUp,
261
- onClick
262
- };
263
250
  const tbProps = tableResizing || resizing || over || readOnly ? {
264
251
  ...commonTdProps,
265
252
  contentEditable: false
266
253
  } : {
267
254
  ...commonTdProps,
268
- ...eventProps
255
+ onMouseEnter: () => onMouseEnter(path),
256
+ onMouseLeave,
257
+ onMouseDown: onMouseDownInCell,
258
+ onMouseUp,
259
+ onClick,
260
+ // mobile events for selection
261
+ onTouchStart: onMouseDownInCell,
262
+ onTouchMove: handleTouchMove,
263
+ onTouchEnd: handleTouchEnd
269
264
  };
270
265
  const dndProps = {
271
266
  id: cellId,
@@ -11,7 +11,6 @@ import withCommon from "./hooks/withCommon";
11
11
  import { serializeToText } from "./utils/serializeToText";
12
12
  import "./Editor.css";
13
13
  import { EditorProvider } from "./hooks/useMouseMove";
14
- import { ensureWrappedVariables } from "./helper/ensureWrappedVariables";
15
14
  import { jsx as _jsx } from "react/jsx-runtime";
16
15
  import { jsxs as _jsxs } from "react/jsx-runtime";
17
16
  const MiniEditor = props => {
@@ -37,8 +36,7 @@ const MiniEditor = props => {
37
36
  needLayout: false
38
37
  }));
39
38
  const [isInteracted, setIsInteracted] = useState(false);
40
- const updatedContent = ensureWrappedVariables(content);
41
- const [value, setValue] = useState(ensureWrappedVariables(updatedContent));
39
+ const [value, setValue] = useState(content);
42
40
  const [deboundedValue] = useDebounce(value, 500);
43
41
  const isReadOnly = readOnly === "readonly";
44
42
  const customProps = {
@@ -151,7 +149,7 @@ const MiniEditor = props => {
151
149
  theme: theme,
152
150
  children: /*#__PURE__*/_jsxs(Slate, {
153
151
  editor: editor,
154
- initialValue: updatedContent,
152
+ initialValue: content,
155
153
  onChange: onChange,
156
154
  children: [/*#__PURE__*/_jsx(BasicToolbar, {
157
155
  ...props,
@@ -4,7 +4,6 @@ import TemplateCard from "./TemplateCard";
4
4
  import FullViewCard from "./FullViewCard";
5
5
  import ButtonTemplateCard from "./ButtonTemplatesCard";
6
6
  import { jsx as _jsx } from "react/jsx-runtime";
7
- import { Fragment as _Fragment } from "react/jsx-runtime";
8
7
  import { jsxs as _jsxs } from "react/jsx-runtime";
9
8
  const CATEGORIES_SORT_INDEX = {
10
9
  Brief: 1,
@@ -47,7 +46,7 @@ const ProgressBar = ({
47
46
  alignItems: "center",
48
47
  margin: 0,
49
48
  padding: 0,
50
- height: "300px",
49
+ height: "50px",
51
50
  overflow: "hidden"
52
51
  },
53
52
  children: /*#__PURE__*/_jsx(CircularProgress, {})
@@ -70,49 +69,41 @@ const AddTemplates = props => {
70
69
  const [categories, setCategories] = useState([]);
71
70
  const [category, setCategory] = useState("");
72
71
  const [templates, setTemplates] = useState([]);
72
+ const [filteredTemplates, setFilteredTemplates] = useState([]);
73
73
  useEffect(() => {
74
- getCategoryList();
74
+ getTemplatesList();
75
75
  }, []);
76
- const getCategoryList = async () => {
77
- setLoading(true);
78
- const categoryDB = await services("listCategory");
79
- if (categoryDB?.data?.Template?.length > 0) {
80
- setCategories(categoryDB.data.Template);
81
- setCategory(categoryDB.data.Template[0]);
82
- getTemplatesList(categoryDB.data.Template[0]);
83
- }
84
- setLoading(false);
76
+ const sortCategory = (a, b) => {
77
+ return (CATEGORIES_SORT_INDEX[a] || Infinity) - (CATEGORIES_SORT_INDEX[b] || Infinity);
85
78
  };
86
- const getTemplatesList = async selectedCategory => {
79
+ const getTemplatesList = async () => {
87
80
  setLoading(true);
88
- const result = await services("listTemplates", {
89
- category: selectedCategory
90
- });
91
- setTemplates(result?.data || []);
81
+ const result = await services("listTemplates", {});
82
+ const tempList = result?.data?.filter(f => f.type === "Template");
83
+ const lic = tempList?.reduce((a, b) => {
84
+ if (a.indexOf(b.category) < 0) {
85
+ a.push(b.category);
86
+ }
87
+ return a;
88
+ }, []).sort(sortCategory);
89
+ const ft = tempList?.filter(f => f.category === lic[0]);
90
+ setTemplates(tempList);
91
+ setCategories(lic);
92
+ setCategory(lic[0]);
93
+ setFilteredTemplates(ft);
92
94
  setLoading(false);
93
95
  };
94
96
  const handleChange = (event, newValue) => {
95
- setTemplates([]);
96
97
  onSearch("");
97
98
  setCategory(newValue);
98
- getTemplatesList(newValue);
99
+ setFilteredTemplates(templates.filter(f => f.category === newValue));
99
100
  };
100
- const onSelectTemplate = card => async () => {
101
+ const onSelectTemplate = card => () => {
101
102
  try {
102
- const {
103
- data
104
- } = await services("templateContent", {
105
- id: card?.id
106
- });
107
- const content = data?.content;
108
- if (content) {
109
- editor.insertNode(JSON.parse(content));
110
- } else {
111
- console.log("No data found");
112
- }
103
+ editor.insertNode(JSON.parse(card.content));
113
104
  onClose();
114
105
  } catch (err) {
115
- console.log("Error inserting template content into editor:", err);
106
+ console.log(err);
116
107
  }
117
108
  };
118
109
  const filterByTitle = f => {
@@ -182,16 +173,16 @@ const AddTemplates = props => {
182
173
  data: categories,
183
174
  handleChange: handleChange
184
175
  })
185
- }), /*#__PURE__*/_jsx(Grid, {
176
+ }), /*#__PURE__*/_jsxs(Grid, {
186
177
  container: true,
187
178
  spacing: 0,
188
179
  className: `${fullScreen ? "fullscreen" : ""}`,
189
180
  sx: classes.templateCardsWrpr,
190
- children: loading ? /*#__PURE__*/_jsx(ProgressBar, {
181
+ children: [/*#__PURE__*/_jsx(ProgressBar, {
191
182
  loading: loading
192
- }) : /*#__PURE__*/_jsx(_Fragment, {
193
- children: templates.filter(filterByTitle).map(renderTemplate)
194
- })
183
+ }), filteredTemplates.filter(filterByTitle).map(m => {
184
+ return renderTemplate(m);
185
+ })]
195
186
  })]
196
187
  });
197
188
  };
@@ -51,8 +51,7 @@ const alignmentOptions = [{
51
51
  }];
52
52
  function SelectAlignment({
53
53
  editor,
54
- classes,
55
- closeMainPopup
54
+ classes
56
55
  }) {
57
56
  const selected = useMemo(() => {
58
57
  return alignmentOptions.find(t => isBlockActive(editor, t.value));
@@ -60,7 +59,6 @@ function SelectAlignment({
60
59
  const onChange = (format, option) => {
61
60
  if (option.type === "block") {
62
61
  toggleBlock(editor, format);
63
- closeMainPopup();
64
62
  }
65
63
  };
66
64
  return /*#__PURE__*/_jsx(CustomSelectTool, {