@flozy/editor 3.2.6 → 3.2.8

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 (15) hide show
  1. package/dist/Editor/Elements/Embed/Frames/DarkFrame.js +3 -2
  2. package/dist/Editor/Elements/Embed/Frames/ImageFrame.js +4 -1
  3. package/dist/Editor/Elements/Embed/Frames/InstaFrame.js +3 -2
  4. package/dist/Editor/Elements/Embed/Frames/InstaFrameDark.js +3 -2
  5. package/dist/Editor/Elements/Embed/Frames/LiteFrame.js +3 -2
  6. package/dist/Editor/Elements/Embed/Frames/RoundedDark.js +3 -2
  7. package/dist/Editor/Elements/Embed/Frames/RoundedLight.js +3 -2
  8. package/dist/Editor/Elements/Embed/Frames/RoundedLightB2.js +3 -2
  9. package/dist/Editor/Elements/Embed/Image.js +98 -68
  10. package/dist/Editor/Elements/Grid/Grid.js +61 -45
  11. package/dist/Editor/Elements/Grid/GridItem.js +28 -20
  12. package/dist/Editor/Toolbar/PopupTool/index.js +0 -4
  13. package/dist/Editor/plugins/withHTML.js +11 -0
  14. package/dist/Editor/utils/helper.js +14 -9
  15. package/package.json +2 -2
package/dist/Editor/Elements/Embed/Frames/DarkFrame.js CHANGED
@@ -8,7 +8,8 @@ const DarkFrame = /*#__PURE__*/forwardRef((props, ref) => {
8
8
  imagePos,
9
9
  handleClick,
10
10
  imageRef,
11
- defaultScale
11
+ defaultScale,
12
+ readOnly
12
13
  } = props;
13
14
  const {
14
15
  calX,
@@ -41,7 +42,7 @@ const DarkFrame = /*#__PURE__*/forwardRef((props, ref) => {
41
42
  fill: `url(#imageSource_${id})`,
42
43
  ref: imageRef,
43
44
  style: {
44
- cursor: "move"
45
+ cursor: readOnly ? "pointer" : "move"
45
46
  }
46
47
  })
47
48
  }), /*#__PURE__*/_jsxs("defs", {
package/dist/Editor/Elements/Embed/Frames/ImageFrame.js CHANGED
@@ -16,7 +16,8 @@ const ImageFrame = props => {
16
16
  id,
17
17
  framePos,
18
18
  onChange,
19
- readOnly
19
+ readOnly,
20
+ handleImageClick
20
21
  } = props;
21
22
  const svgRef = useRef();
22
23
  const [dom, setDOM] = useState(null);
@@ -75,6 +76,8 @@ const ImageFrame = props => {
75
76
  if (!readOnly) {
76
77
  setSelectedPath(id);
77
78
  setAnchorEl(svgRef?.current);
79
+ } else {
80
+ handleImageClick();
78
81
  }
79
82
  };
80
83
  const onClose = () => {
package/dist/Editor/Elements/Embed/Frames/InstaFrame.js CHANGED
@@ -8,7 +8,8 @@ const InstaFrame = /*#__PURE__*/forwardRef((props, ref) => {
8
8
  imagePos,
9
9
  handleClick,
10
10
  imageRef,
11
- defaultScale
11
+ defaultScale,
12
+ readOnly
12
13
  } = props;
13
14
  const {
14
15
  calX,
@@ -98,7 +99,7 @@ const InstaFrame = /*#__PURE__*/forwardRef((props, ref) => {
98
99
  strokeWidth: "5",
99
100
  fill: `url(#imageSource_${id})`,
100
101
  style: {
101
- cursor: "move"
102
+ cursor: readOnly ? "pointer" : "move"
102
103
  },
103
104
  ref: imageRef
104
105
  }), /*#__PURE__*/_jsx("defs", {
package/dist/Editor/Elements/Embed/Frames/InstaFrameDark.js CHANGED
@@ -8,7 +8,8 @@ const InstaFrame = /*#__PURE__*/forwardRef((props, ref) => {
8
8
  imagePos,
9
9
  handleClick,
10
10
  imageRef,
11
- defaultScale
11
+ defaultScale,
12
+ readOnly
12
13
  } = props;
13
14
  const {
14
15
  calX,
@@ -98,7 +99,7 @@ const InstaFrame = /*#__PURE__*/forwardRef((props, ref) => {
98
99
  fill: `url(#imageSource_${id})`,
99
100
  ref: imageRef,
100
101
  style: {
101
- cursor: "move"
102
+ cursor: readOnly ? "pointer" : "move"
102
103
  }
103
104
  }), /*#__PURE__*/_jsx("defs", {
104
105
  children: /*#__PURE__*/_jsx("pattern", {
package/dist/Editor/Elements/Embed/Frames/LiteFrame.js CHANGED
@@ -8,7 +8,8 @@ const DarkFrame = /*#__PURE__*/forwardRef((props, ref) => {
8
8
  imagePos,
9
9
  handleClick,
10
10
  imageRef,
11
- defaultScale
11
+ defaultScale,
12
+ readOnly
12
13
  } = props;
13
14
  const {
14
15
  calX,
@@ -44,7 +45,7 @@ const DarkFrame = /*#__PURE__*/forwardRef((props, ref) => {
44
45
  fill: `url(#imageSource_${id})`,
45
46
  ref: imageRef,
46
47
  style: {
47
- cursor: "move"
48
+ cursor: readOnly ? "pointer" : "move"
48
49
  }
49
50
  })
50
51
  }), /*#__PURE__*/_jsxs("defs", {
package/dist/Editor/Elements/Embed/Frames/RoundedDark.js CHANGED
@@ -8,7 +8,8 @@ const RoundedDark = /*#__PURE__*/forwardRef((props, ref) => {
8
8
  imagePos,
9
9
  handleClick,
10
10
  imageRef,
11
- defaultScale
11
+ defaultScale,
12
+ readOnly
12
13
  } = props;
13
14
  const {
14
15
  calX,
@@ -42,7 +43,7 @@ const RoundedDark = /*#__PURE__*/forwardRef((props, ref) => {
42
43
  fill: `url(#imageSource_${id})`,
43
44
  ref: imageRef,
44
45
  style: {
45
- cursor: "move"
46
+ cursor: readOnly ? "pointer" : "move"
46
47
  }
47
48
  })
48
49
  }), /*#__PURE__*/_jsxs("defs", {
package/dist/Editor/Elements/Embed/Frames/RoundedLight.js CHANGED
@@ -8,7 +8,8 @@ const RoundedLight = /*#__PURE__*/forwardRef((props, ref) => {
8
8
  imagePos,
9
9
  handleClick,
10
10
  imageRef,
11
- defaultScale
11
+ defaultScale,
12
+ readOnly
12
13
  } = props;
13
14
  const {
14
15
  calX,
@@ -39,7 +40,7 @@ const RoundedLight = /*#__PURE__*/forwardRef((props, ref) => {
39
40
  fill: `url(#imageSource_${id})`,
40
41
  ref: imageRef,
41
42
  style: {
42
- cursor: "move"
43
+ cursor: readOnly ? "pointer" : "move"
43
44
  }
44
45
  }), /*#__PURE__*/_jsx("defs", {
45
46
  children: /*#__PURE__*/_jsx("pattern", {
package/dist/Editor/Elements/Embed/Frames/RoundedLightB2.js CHANGED
@@ -8,7 +8,8 @@ const RoundedLightB2 = /*#__PURE__*/forwardRef((props, ref) => {
8
8
  imagePos,
9
9
  handleClick,
10
10
  imageRef,
11
- defaultScale
11
+ defaultScale,
12
+ readOnly
12
13
  } = props;
13
14
  const {
14
15
  calX,
@@ -39,7 +40,7 @@ const RoundedLightB2 = /*#__PURE__*/forwardRef((props, ref) => {
39
40
  fill: `url(#imageSource_${id})`,
40
41
  ref: imageRef,
41
42
  style: {
42
- cursor: "move"
43
+ cursor: readOnly ? "pointer" : "move"
43
44
  }
44
45
  }), /*#__PURE__*/_jsx("defs", {
45
46
  children: /*#__PURE__*/_jsx("pattern", {
package/dist/Editor/Elements/Embed/Image.js CHANGED
@@ -15,6 +15,90 @@ import LinkSettings from "../../common/LinkSettings";
15
15
  import { handleLinkType } from "../../utils/helper";
16
16
  import { jsx as _jsx } from "react/jsx-runtime";
17
17
  import { jsxs as _jsxs } from "react/jsx-runtime";
18
+ const ToolBar = ({
19
+ isEmpty,
20
+ onSettings,
21
+ setOpenNav
22
+ }) => {
23
+ return !isEmpty ? /*#__PURE__*/_jsxs("div", {
24
+ className: "element-toolbar visible-on-hover",
25
+ contentEditable: false,
26
+ style: {
27
+ top: "0px",
28
+ right: "0px",
29
+ left: "auto",
30
+ margin: "0px"
31
+ },
32
+ children: [/*#__PURE__*/_jsx(Tooltip, {
33
+ title: "Image Settings",
34
+ arrow: true,
35
+ children: /*#__PURE__*/_jsx(IconButton, {
36
+ onClick: onSettings,
37
+ children: /*#__PURE__*/_jsx(GridSettingsIcon, {})
38
+ })
39
+ }), /*#__PURE__*/_jsx(Tooltip, {
40
+ title: "Link Settings",
41
+ arrow: true,
42
+ children: /*#__PURE__*/_jsx(IconButton, {
43
+ onClick: () => setOpenNav(true),
44
+ children: /*#__PURE__*/_jsx(LinkIcon, {})
45
+ })
46
+ })]
47
+ }) : null;
48
+ };
49
+ const ImageContent = ({
50
+ readOnly,
51
+ setOpenSettings,
52
+ element,
53
+ handleImageClick,
54
+ onTouchEnd,
55
+ path
56
+ }) => {
57
+ const {
58
+ alt,
59
+ url,
60
+ borderColor,
61
+ borderRadius,
62
+ borderWidth,
63
+ boxShadow,
64
+ frame = null,
65
+ objectFit,
66
+ webAddress
67
+ } = element;
68
+ return !url && !readOnly ? /*#__PURE__*/_jsxs(Box, {
69
+ component: "button",
70
+ className: "element-empty-btn",
71
+ contentEditable: false,
72
+ onClick: () => {
73
+ setOpenSettings(true);
74
+ },
75
+ children: [/*#__PURE__*/_jsx(Icon, {
76
+ icon: "image"
77
+ }), "Add Image"]
78
+ }) : /*#__PURE__*/_jsx(Box, {
79
+ component: "img",
80
+ className: "emb-img",
81
+ sx: {
82
+ borderRadius: {
83
+ ...getBreakPointsValue(borderRadius || {}, null, "overrideBorderRadius", true)
84
+ },
85
+ objectFit: "cover",
86
+ boxShadow: boxShadow || "none",
87
+ height: objectFit ? "100%" : "auto",
88
+ opacity: frame ? 0 : 1,
89
+ cursor: webAddress ? "pointer" : "",
90
+ border: `1px solid ${borderColor}`,
91
+ borderWidth: `${borderWidth}`?.includes("px") ? borderWidth : `${borderWidth}px`
92
+ },
93
+ alt: alt,
94
+ src: url,
95
+ onClick: handleImageClick,
96
+ onTouchEnd: onTouchEnd // for mobile
97
+ ,
98
+ "data-path": path.join(","),
99
+ draggable: false
100
+ });
101
+ };
18
102
  const Image = ({
19
103
  attributes,
20
104
  element,
@@ -23,14 +107,9 @@ const Image = ({
23
107
  }) => {
24
108
  const {
25
109
  url,
26
- alt,
27
110
  bannerSpacing,
28
111
  alignment,
29
112
  bgColor,
30
- borderColor,
31
- borderRadius,
32
- borderWidth,
33
- boxShadow,
34
113
  width: oldWidth,
35
114
  xsHidden,
36
115
  objectFit,
@@ -132,67 +211,6 @@ const Image = ({
132
211
  const onPosChange = data => {
133
212
  onSave(data);
134
213
  };
135
- const ToolBar = () => {
136
- return !isEmpty ? /*#__PURE__*/_jsxs("div", {
137
- className: "element-toolbar visible-on-hover",
138
- contentEditable: false,
139
- style: {
140
- top: "0px",
141
- right: "0px",
142
- left: "auto",
143
- margin: "0px"
144
- },
145
- children: [/*#__PURE__*/_jsx(Tooltip, {
146
- title: "Image Settings",
147
- arrow: true,
148
- children: /*#__PURE__*/_jsx(IconButton, {
149
- onClick: onSettings,
150
- children: /*#__PURE__*/_jsx(GridSettingsIcon, {})
151
- })
152
- }), /*#__PURE__*/_jsx(Tooltip, {
153
- title: "Link Settings",
154
- arrow: true,
155
- children: /*#__PURE__*/_jsx(IconButton, {
156
- onClick: () => setOpenNav(true),
157
- children: /*#__PURE__*/_jsx(LinkIcon, {})
158
- })
159
- })]
160
- }) : null;
161
- };
162
- const ImageContent = () => {
163
- return !url && !readOnly ? /*#__PURE__*/_jsxs(Box, {
164
- component: "button",
165
- className: "element-empty-btn",
166
- contentEditable: false,
167
- onClick: () => {
168
- setOpenSettings(true);
169
- },
170
- children: [/*#__PURE__*/_jsx(Icon, {
171
- icon: "image"
172
- }), "Add Image"]
173
- }) : /*#__PURE__*/_jsx(Box, {
174
- component: "img",
175
- className: "emb-img",
176
- sx: {
177
- borderRadius: {
178
- ...getBreakPointsValue(borderRadius || {}, null, "overrideBorderRadius", true)
179
- },
180
- objectFit: "cover",
181
- boxShadow: boxShadow || "none",
182
- height: objectFit ? "100%" : "auto",
183
- opacity: frame ? 0 : 1,
184
- cursor: webAddress ? "pointer" : "",
185
- border: `1px solid ${borderColor}`,
186
- borderWidth: `${borderWidth}`?.includes('px') ? borderWidth : `${borderWidth}px`
187
- },
188
- alt: alt,
189
- src: url,
190
- onClick: handleImageClick,
191
- onTouchEnd: onTouchEnd,
192
- "data-path": path.join(","),
193
- draggable: false
194
- });
195
- };
196
214
  const getWidth = () => {
197
215
  if (resizing) {
198
216
  return {
@@ -246,7 +264,18 @@ const Image = ({
246
264
  position: "relative",
247
265
  ...getWidth()
248
266
  },
249
- children: [!readOnly && /*#__PURE__*/_jsx(ToolBar, {}), /*#__PURE__*/_jsx(ImageContent, {}), url && frames[frame] ? /*#__PURE__*/_jsx(Box, {
267
+ children: [!readOnly && /*#__PURE__*/_jsx(ToolBar, {
268
+ isEmpty: isEmpty,
269
+ onSettings: onSettings,
270
+ setOpenNav: setOpenNav
271
+ }), /*#__PURE__*/_jsx(ImageContent, {
272
+ readOnly: readOnly,
273
+ setOpenSettings: setOpenSettings,
274
+ element: element,
275
+ handleImageClick: handleImageClick,
276
+ onTouchEnd: onTouchEnd,
277
+ path: path
278
+ }), url && frames[frame] ? /*#__PURE__*/_jsx(Box, {
250
279
  component: "div",
251
280
  className: "image-frame",
252
281
  "data-path": path.join(","),
@@ -256,7 +285,8 @@ const Image = ({
256
285
  href: url,
257
286
  id: path.join(","),
258
287
  onChange: onPosChange,
259
- readOnly: readOnly
288
+ readOnly: readOnly,
289
+ handleImageClick: handleImageClick
260
290
  })
261
291
  }) : null, selected && !readOnly && /*#__PURE__*/_jsx(IconButton, {
262
292
  onPointerDown: onMouseDown,
package/dist/Editor/Elements/Grid/Grid.js CHANGED
@@ -22,6 +22,58 @@ const GridSettingsPoupComp = {
22
22
  section: SectionPopup,
23
23
  grid: GridPopup
24
24
  };
25
+ const GridToolBar = ({
26
+ selected,
27
+ showTool,
28
+ onSettings,
29
+ onAddGridItem,
30
+ onAddSection,
31
+ onMoveSection,
32
+ path
33
+ }) => {
34
+ return selected && !showTool ? /*#__PURE__*/_jsxs("div", {
35
+ className: "grid-container-toolbar",
36
+ contentEditable: false,
37
+ children: [/*#__PURE__*/_jsx(Tooltip, {
38
+ title: "Grid Settings",
39
+ arrow: true,
40
+ children: /*#__PURE__*/_jsx(IconButton, {
41
+ onClick: onSettings,
42
+ children: /*#__PURE__*/_jsx(GridSettingsIcon, {})
43
+ })
44
+ }), /*#__PURE__*/_jsx(Tooltip, {
45
+ title: "Add Grid Item",
46
+ arrow: true,
47
+ children: /*#__PURE__*/_jsx(IconButton, {
48
+ onClick: onAddGridItem,
49
+ children: /*#__PURE__*/_jsx(GridAddGridIcon, {})
50
+ })
51
+ }), /*#__PURE__*/_jsx(Tooltip, {
52
+ title: "Duplicate",
53
+ arrow: true,
54
+ children: /*#__PURE__*/_jsx(IconButton, {
55
+ onClick: onAddSection(),
56
+ children: /*#__PURE__*/_jsx(ContentCopyIcon, {})
57
+ })
58
+ }), path.length === 2 ? /*#__PURE__*/_jsxs(_Fragment, {
59
+ children: [/*#__PURE__*/_jsx(Tooltip, {
60
+ title: "Move Up",
61
+ arrow: true,
62
+ children: /*#__PURE__*/_jsx(IconButton, {
63
+ onClick: onMoveSection("up"),
64
+ children: /*#__PURE__*/_jsx(ArrowUpwardIcon, {})
65
+ })
66
+ }), /*#__PURE__*/_jsx(Tooltip, {
67
+ title: "Move Down",
68
+ arrow: true,
69
+ children: /*#__PURE__*/_jsx(IconButton, {
70
+ onClick: onMoveSection("down"),
71
+ children: /*#__PURE__*/_jsx(ArrowDownwardIcon, {})
72
+ })
73
+ })]
74
+ }) : null]
75
+ }) : null;
76
+ };
25
77
  const Grid = props => {
26
78
  const {
27
79
  attributes,
@@ -211,50 +263,6 @@ const Grid = props => {
211
263
  })]
212
264
  }) : null;
213
265
  };
214
- const GridToolBar = () => {
215
- return selected && !showTool ? /*#__PURE__*/_jsxs("div", {
216
- className: "grid-container-toolbar",
217
- contentEditable: false,
218
- children: [/*#__PURE__*/_jsx(Tooltip, {
219
- title: "Grid Settings",
220
- arrow: true,
221
- children: /*#__PURE__*/_jsx(IconButton, {
222
- onClick: onSettings,
223
- children: /*#__PURE__*/_jsx(GridSettingsIcon, {})
224
- })
225
- }), /*#__PURE__*/_jsx(Tooltip, {
226
- title: "Add Grid Item",
227
- arrow: true,
228
- children: /*#__PURE__*/_jsx(IconButton, {
229
- onClick: onAddGridItem,
230
- children: /*#__PURE__*/_jsx(GridAddGridIcon, {})
231
- })
232
- }), /*#__PURE__*/_jsx(Tooltip, {
233
- title: "Duplicate",
234
- arrow: true,
235
- children: /*#__PURE__*/_jsx(IconButton, {
236
- onClick: onAddSection(),
237
- children: /*#__PURE__*/_jsx(ContentCopyIcon, {})
238
- })
239
- }), path.length === 2 ? /*#__PURE__*/_jsxs(_Fragment, {
240
- children: [/*#__PURE__*/_jsx(Tooltip, {
241
- title: "Move Up",
242
- arrow: true,
243
- children: /*#__PURE__*/_jsx(IconButton, {
244
- onClick: onMoveSection("up"),
245
- children: /*#__PURE__*/_jsx(ArrowUpwardIcon, {})
246
- })
247
- }), /*#__PURE__*/_jsx(Tooltip, {
248
- title: "Move Down",
249
- arrow: true,
250
- children: /*#__PURE__*/_jsx(IconButton, {
251
- onClick: onMoveSection("down"),
252
- children: /*#__PURE__*/_jsx(ArrowDownwardIcon, {})
253
- })
254
- })]
255
- }) : null]
256
- }) : null;
257
- };
258
266
  const sectionId = id ? {
259
267
  id
260
268
  } : {};
@@ -312,7 +320,15 @@ const Grid = props => {
312
320
  }), /*#__PURE__*/_jsx("div", {
313
321
  className: "element-selector-dots br",
314
322
  children: " "
315
- }), /*#__PURE__*/_jsx(GridToolBar, {})]
323
+ }), /*#__PURE__*/_jsx(GridToolBar, {
324
+ selected: selected,
325
+ showTool: showTool,
326
+ onSettings: onSettings,
327
+ onAddGridItem: onAddGridItem,
328
+ onAddSection: onAddSection,
329
+ onMoveSection: onMoveSection,
330
+ path: path
331
+ })]
316
332
  }), openSetttings ? /*#__PURE__*/_jsx(PoupComp, {
317
333
  element: element,
318
334
  onSave: onSave,
package/dist/Editor/Elements/Grid/GridItem.js CHANGED
@@ -10,6 +10,29 @@ import { getBreakPointsValue, getTRBLBreakPoints } from "../../helper/theme";
10
10
  import { isEmptyNode } from "../../utils/helper";
11
11
  import { jsx as _jsx } from "react/jsx-runtime";
12
12
  import { jsxs as _jsxs } from "react/jsx-runtime";
13
+ const GridItemToolbar = ({
14
+ selected,
15
+ showTool,
16
+ onSettings
17
+ }) => {
18
+ return selected && !showTool ? /*#__PURE__*/_jsx("div", {
19
+ contentEditable: false,
20
+ className: "grid-item-toolbar",
21
+ style: {
22
+ top: "-14px",
23
+ left: "-14px"
24
+ },
25
+ children: /*#__PURE__*/_jsx(Tooltip, {
26
+ title: "Grid Item Settings",
27
+ arrow: true,
28
+ children: /*#__PURE__*/_jsx(IconButton, {
29
+ size: "small",
30
+ onClick: onSettings,
31
+ children: /*#__PURE__*/_jsx(GridSettingsIcon, {})
32
+ })
33
+ })
34
+ }) : null;
35
+ };
13
36
  const GridItem = props => {
14
37
  const {
15
38
  attributes,
@@ -51,25 +74,6 @@ const GridItem = props => {
51
74
  const selected = hoverPath === path.join(",");
52
75
  const [showTool] = useEditorSelection(editor);
53
76
  const isEmpty = !readOnly && isEmptyNode(editor, element?.children, path) ? "empty" : "";
54
- const GridItemToolbar = () => {
55
- return selected && !showTool ? /*#__PURE__*/_jsx("div", {
56
- contentEditable: false,
57
- className: "grid-item-toolbar",
58
- style: {
59
- top: "-14px",
60
- left: "-14px"
61
- },
62
- children: /*#__PURE__*/_jsx(Tooltip, {
63
- title: "Grid Item Settings",
64
- arrow: true,
65
- children: /*#__PURE__*/_jsx(IconButton, {
66
- size: "small",
67
- onClick: onSettings,
68
- children: /*#__PURE__*/_jsx(GridSettingsIcon, {})
69
- })
70
- })
71
- }) : null;
72
- };
73
77
  const onSettings = () => {
74
78
  setOpenSettings(true);
75
79
  };
@@ -153,7 +157,11 @@ const GridItem = props => {
153
157
  }), /*#__PURE__*/_jsx("div", {
154
158
  className: "element-selector-dots br",
155
159
  children: " "
156
- }), /*#__PURE__*/_jsx(GridItemToolbar, {})]
160
+ }), /*#__PURE__*/_jsx(GridItemToolbar, {
161
+ selected: selected,
162
+ showTool: showTool,
163
+ onSettings: onSettings
164
+ })]
157
165
  }), /*#__PURE__*/_jsx(Box, {
158
166
  className: `gi-inner-cw ${animation || ""} content-editable ${isEmpty} np`,
159
167
  component: "div",
package/dist/Editor/Toolbar/PopupTool/index.js CHANGED
@@ -55,10 +55,6 @@ const PopupTool = props => {
55
55
  const updateAnchorEl = () => {
56
56
  try {
57
57
  const domSelection = window.getSelection();
58
- if (!domSelection?.anchorOffset) {
59
- // no selection
60
- return;
61
- }
62
58
  const domRange = domSelection?.getRangeAt(0);
63
59
  const {
64
60
  startOffset,
package/dist/Editor/plugins/withHTML.js CHANGED
@@ -83,6 +83,17 @@ const withHtml = editor => {
83
83
  }
84
84
  } else if (html) {
85
85
  const parsed = new DOMParser().parseFromString(html, "text/html");
86
+ const isGoogleSheet = parsed.body.querySelector("google-sheets-html-origin");
87
+ if (isGoogleSheet) {
88
+ const table = parsed.body.querySelector("table");
89
+ const colGrp = table.querySelector("colgroup");
90
+ if (colGrp) {
91
+ colGrp.remove();
92
+ }
93
+ const fragment = deserialize(table);
94
+ Transforms.insertFragment(editor, [fragment]);
95
+ return;
96
+ }
86
97
  const fragment = deserialize(parsed.body);
87
98
  const formattedFragment = formatFragment[eltype] ? formatFragment[eltype](fragment) : fragment;
88
99
  Transforms.insertFragment(editor, formattedFragment);
package/dist/Editor/utils/helper.js CHANGED
@@ -204,6 +204,9 @@ export const decodeAndParseBase64 = encodedString => {
204
204
  const jsonData = JSON.parse(decodedURLString);
205
205
  return jsonData;
206
206
  };
207
+ const hasVerticalScrollbar = (element = {}) => {
208
+ return element.scrollHeight > element.clientHeight;
209
+ };
207
210
  export const handleLinkType = (url, linkType, readOnly, openInNewTab, onClick = () => {}) => {
208
211
  const props = {};
209
212
  if (!readOnly) {
@@ -252,15 +255,17 @@ export const handleLinkType = (url, linkType, readOnly, openInNewTab, onClick =
252
255
  case "scrollTopOrBottom":
253
256
  props.component = "button";
254
257
  props.onClick = () => {
255
- const scrollEle = document.getElementById("slate-wrapper-scroll-container");
256
- if (scrollEle) {
257
- if (url === "top") {
258
- // top of the page
259
- scrollEle.scrollTo(0, 0);
260
- } else if (url === "bottom") {
261
- // bottom of the page
262
- scrollEle.scrollTo(0, scrollEle.scrollHeight);
263
- }
258
+ const slateWrapper = document.getElementById("slate-wrapper-scroll-container");
259
+ const isSlateWrapperScroll = hasVerticalScrollbar(slateWrapper);
260
+ const scrollFrom = isSlateWrapperScroll ? slateWrapper : window;
261
+ if (url === "top") {
262
+ // top of the page
263
+ scrollFrom.scrollTo(0, 0);
264
+ } else if (url === "bottom") {
265
+ const pageHeight = isSlateWrapperScroll ? slateWrapper.scrollHeight : document.body.scrollHeight;
266
+
267
+ // bottom of the page
268
+ scrollFrom.scrollTo(0, pageHeight);
264
269
  }
265
270
  };
266
271
  break;
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@flozy/editor",
3
- "version": "3.2.6",
3
+ "version": "3.2.8",
4
4
  "description": "An Editor for flozy app brain",
5
5
  "files": [
6
6
  "dist"
@@ -63,7 +63,7 @@
63
63
  "storybook": "storybook dev -p 6006",
64
64
  "build-storybook": "storybook build",
65
65
  "publish:npm": "rm -rf dist && mkdir dist && babel src/components -d dist --copy-files",
66
- "publish:local": "rm -rf /Users/agmac03/flozy/client/node_modules/@flozy/editor/dist && babel src/components -d /Users/agmac03/flozy/client/node_modules/@flozy/editor/dist --copy-files"
66
+ "publish:local": "rm -rf /Users/agmac23/Desktop/surya/sweetpsocial-2.0/client/node_modules/@flozy/editor/dist && babel src/components -d /Users/agmac23/Desktop/surya/sweetpsocial-2.0/client/node_modules/@flozy/editor/dist --copy-files"
67
67
  },
68
68
  "eslintConfig": {
69
69
  "extends": [