@flozy/editor 4.2.7 → 4.2.9

Sign up to get free protection for your applications and to get access to all the features.
@@ -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, upArrowEvent, downArrowEvent } from "./utils/events";
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 containerBottom = container?.getBoundingClientRect()?.bottom;
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: 200,
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
  })]
@@ -6,7 +6,7 @@ const EmojiPicker = props => {
6
6
  const {
7
7
  onEmojiSelect,
8
8
  onClose,
9
- theme = 'dark'
9
+ theme = 'light'
10
10
  } = props;
11
11
  return /*#__PURE__*/_jsx(_Fragment, {
12
12
  children: /*#__PURE__*/_jsx(Picker, {
@@ -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,
@@ -23,7 +23,7 @@ const useContextMenuStyle = ({
23
23
  }
24
24
  },
25
25
  "&:hover": {
26
- color: theme?.palette?.editor?.background,
26
+ color: theme?.palette?.editor?.activeColor,
27
27
  background: "rgba(233, 243, 254, 1)",
28
28
  "& .shortcut-help-info": {
29
29
  color: theme?.palette?.editor?.background
@@ -38,10 +38,10 @@ const useOptionsPopupStyle = ({
38
38
  borderRadius: "7px",
39
39
  color: theme?.palette?.editor?.textColor,
40
40
  "&:hover": {
41
- color: theme?.palette?.editor?.background,
41
+ color: theme?.palette?.editor?.activeColor,
42
42
  background: "rgba(233, 243, 254, 1)",
43
43
  "& .MuiTypography-root": {
44
- color: theme?.palette?.editor?.background
44
+ color: theme?.palette?.editor?.activeColor
45
45
  }
46
46
  }
47
47
  }
@@ -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
  };
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@flozy/editor",
3
- "version": "4.2.7",
3
+ "version": "4.2.9",
4
4
  "description": "An Editor for flozy app brain",
5
5
  "files": [
6
6
  "dist"