@flozy/editor 4.2.8 → 4.2.9
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.
- package/dist/Editor/CommonEditor.js +6 -7
- package/dist/Editor/Elements/Emoji/EmojiButton.js +4 -2
- package/dist/Editor/Elements/Emoji/EmojiPicker.js +1 -1
- package/dist/Editor/Elements/FreeGrid/Options/sectionItemOptions.js +3 -1
- package/dist/Editor/common/MentionsPopup/index.js +2 -1
- package/dist/Editor/helper/index.js +6 -3
- package/dist/Editor/utils/events.js +0 -36
- package/package.json +1 -1
|
@@ -10,7 +10,7 @@ import { draftToSlate } from "./utils/draftToSlate";
|
|
|
10
10
|
import useMentions from "./hooks/useMentions";
|
|
11
11
|
import MentionsPopup from "./common/MentionsPopup";
|
|
12
12
|
import { RemoteCursorOverlay } from "./RemoteCursorOverlay/Overlay";
|
|
13
|
-
import { mentionsEvent, commands, indentation, escapeEvent, enterEvent
|
|
13
|
+
import { mentionsEvent, commands, indentation, escapeEvent, enterEvent } from "./utils/events";
|
|
14
14
|
import withCommon from "./hooks/withCommon";
|
|
15
15
|
import DialogWrapper from "./DialogWrapper";
|
|
16
16
|
import { serializeToText } from "./utils/serializeToText";
|
|
@@ -379,10 +379,6 @@ const CommonEditor = /*#__PURE__*/forwardRef((props, ref) => {
|
|
|
379
379
|
});
|
|
380
380
|
}
|
|
381
381
|
}
|
|
382
|
-
} else if (event.key === "ArrowUp" && otherProps?.tagName !== "Pages") {
|
|
383
|
-
upArrowEvent(event, editor);
|
|
384
|
-
} else if (event.key === "ArrowDown" && otherProps?.tagName !== "Pages") {
|
|
385
|
-
downArrowEvent(event, editor);
|
|
386
382
|
}
|
|
387
383
|
}, [chars, editor, target, mentions, setMentions, search, type, mentionsRef]);
|
|
388
384
|
const Overlay = collaborativeEditor && !isReadOnly ? RemoteCursorOverlay : React.Fragment;
|
|
@@ -447,10 +443,13 @@ const CommonEditor = /*#__PURE__*/forwardRef((props, ref) => {
|
|
|
447
443
|
const selection = window?.getSelection();
|
|
448
444
|
if (selection && selection.rangeCount > 0) {
|
|
449
445
|
const cursorPosition = selection.getRangeAt(0)?.getBoundingClientRect();
|
|
450
|
-
const
|
|
446
|
+
const containerRect = container?.getBoundingClientRect();
|
|
447
|
+
const containerBottom = containerRect?.bottom;
|
|
451
448
|
if (cursorPosition && cursorPosition.bottom > containerBottom - 250) {
|
|
449
|
+
// Calculate dynamic scroll based on remaining space
|
|
450
|
+
const scrollAmount = Math.min(200, cursorPosition.bottom - containerBottom + 250);
|
|
452
451
|
container?.scrollBy({
|
|
453
|
-
top:
|
|
452
|
+
top: scrollAmount,
|
|
454
453
|
behavior: "smooth"
|
|
455
454
|
});
|
|
456
455
|
}
|
|
@@ -12,7 +12,8 @@ import { jsxs as _jsxs } from "react/jsx-runtime";
|
|
|
12
12
|
const EmojiButton = /*#__PURE__*/forwardRef((props, ref) => {
|
|
13
13
|
const {
|
|
14
14
|
icoBtnType,
|
|
15
|
-
selectionTarget
|
|
15
|
+
selectionTarget,
|
|
16
|
+
theme = 'light'
|
|
16
17
|
} = props;
|
|
17
18
|
const editor = useSlateStatic();
|
|
18
19
|
const [anchorEl, setAnchorEl] = useState(null);
|
|
@@ -67,7 +68,8 @@ const EmojiButton = /*#__PURE__*/forwardRef((props, ref) => {
|
|
|
67
68
|
children: /*#__PURE__*/_jsx(Paper, {
|
|
68
69
|
children: /*#__PURE__*/_jsx(EmojiPicker, {
|
|
69
70
|
data: data,
|
|
70
|
-
onEmojiSelect: onEmojiSelect
|
|
71
|
+
onEmojiSelect: onEmojiSelect,
|
|
72
|
+
theme: theme?.palette?.type
|
|
71
73
|
})
|
|
72
74
|
})
|
|
73
75
|
})]
|
|
@@ -2,6 +2,7 @@ const commonOptions = ["drag", "edit", "settings", "saveAsTemplate", "close"];
|
|
|
2
2
|
const textOptions = ["edit", "settings", "link", "saveAsTemplate", "close"];
|
|
3
3
|
const buttonOptions = ["settings", "link", "saveAsTemplate", "close"];
|
|
4
4
|
const imageOptions = ["settings", "link", "imageFrame", "saveAsTemplate", "close"];
|
|
5
|
+
const videoOptions = ["settings", "saveAsTemplate", "close"];
|
|
5
6
|
const boxOptions = ["settings", "link", "saveAsTemplate", "close"];
|
|
6
7
|
const appHeaderOptions = ["settings", "saveAsTemplate", "close"];
|
|
7
8
|
const tableOptions = ["drag", "edit", "settings", "saveAsTemplate", "close"];
|
|
@@ -18,6 +19,7 @@ const itemOptions = {
|
|
|
18
19
|
form: formOptions,
|
|
19
20
|
section: sectionOptions,
|
|
20
21
|
table: tableOptions,
|
|
21
|
-
embedScript: embedScriptOptions
|
|
22
|
+
embedScript: embedScriptOptions,
|
|
23
|
+
video: videoOptions
|
|
22
24
|
};
|
|
23
25
|
export default itemOptions;
|
|
@@ -87,7 +87,8 @@ const MentionsPopup = /*#__PURE__*/forwardRef((props, ref) => {
|
|
|
87
87
|
ref: i === index ? papperRef : null,
|
|
88
88
|
children: char.renderComponent ? char.renderComponent({
|
|
89
89
|
ref: index === i ? buttonRef : null,
|
|
90
|
-
selectionTarget: target
|
|
90
|
+
selectionTarget: target,
|
|
91
|
+
theme: theme
|
|
91
92
|
}) : ListElement ? /*#__PURE__*/_jsx(ListElement, {
|
|
92
93
|
classes: classes,
|
|
93
94
|
data: char,
|
|
@@ -299,9 +299,12 @@ export const getTextColor = (color = "") => {
|
|
|
299
299
|
return color?.indexOf("gradient") >= 0 ? {
|
|
300
300
|
background: color?.concat("text"),
|
|
301
301
|
WebkitBackgroundClip: "text",
|
|
302
|
-
WebkitTextFillColor: "transparent",
|
|
303
|
-
color: "transparent",
|
|
304
|
-
caretColor: "black"
|
|
302
|
+
WebkitTextFillColor: "transparent !important",
|
|
303
|
+
color: "transparent !important",
|
|
304
|
+
caretColor: "black",
|
|
305
|
+
'& span': {
|
|
306
|
+
color: "transparent !important"
|
|
307
|
+
}
|
|
305
308
|
} : {
|
|
306
309
|
color
|
|
307
310
|
};
|
|
@@ -285,40 +285,4 @@ export const enterEvent = (e, editor, isMobile) => {
|
|
|
285
285
|
} catch (err) {
|
|
286
286
|
console.log(err);
|
|
287
287
|
}
|
|
288
|
-
};
|
|
289
|
-
export const upArrowEvent = (e, editor) => {
|
|
290
|
-
try {
|
|
291
|
-
const {
|
|
292
|
-
selection
|
|
293
|
-
} = editor;
|
|
294
|
-
if (!selection) return;
|
|
295
|
-
const prevNodePath = Editor.before(editor, selection, {
|
|
296
|
-
unit: "line"
|
|
297
|
-
});
|
|
298
|
-
if (prevNodePath) {
|
|
299
|
-
e.preventDefault();
|
|
300
|
-
Transforms.select(editor, prevNodePath);
|
|
301
|
-
ReactEditor.focus(editor);
|
|
302
|
-
}
|
|
303
|
-
} catch (err) {
|
|
304
|
-
console.log(err);
|
|
305
|
-
}
|
|
306
|
-
};
|
|
307
|
-
export const downArrowEvent = (e, editor) => {
|
|
308
|
-
try {
|
|
309
|
-
const {
|
|
310
|
-
selection
|
|
311
|
-
} = editor;
|
|
312
|
-
if (!selection) return;
|
|
313
|
-
const nextNodePath = Editor.after(editor, selection, {
|
|
314
|
-
unit: "line"
|
|
315
|
-
});
|
|
316
|
-
if (nextNodePath) {
|
|
317
|
-
e.preventDefault();
|
|
318
|
-
Transforms.select(editor, nextNodePath);
|
|
319
|
-
ReactEditor.focus(editor);
|
|
320
|
-
}
|
|
321
|
-
} catch (err) {
|
|
322
|
-
console.log(err);
|
|
323
|
-
}
|
|
324
288
|
};
|