@lobehub/editor 1.26.1 → 1.27.0

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.
@@ -25,6 +25,7 @@ export var ReactToolbarPlugin = function ReactToolbarPlugin(_ref) {
25
25
  var _useStyles = useStyles(),
26
26
  cx = _useStyles.cx,
27
27
  styles = _useStyles.styles;
28
+ var isMouseDownRef = useRef(false);
28
29
  var $updateTextFormatFloatingToolbar = useCallback(function (editor) {
29
30
  if (!anchorElemRef.current) {
30
31
  return;
@@ -44,6 +45,37 @@ export var ReactToolbarPlugin = function ReactToolbarPlugin(_ref) {
44
45
  popupCharStylesEditorElem.style.transform = 'translate(-10000px, -10000px)';
45
46
  }
46
47
  }, [anchorElemRef]);
48
+ var $hideFloatingToolbar = useCallback(function () {
49
+ if (!anchorElemRef.current) {
50
+ return;
51
+ }
52
+ var popupCharStylesEditorElem = popupCharStylesEditorRef.current;
53
+ if (popupCharStylesEditorElem === null) {
54
+ return;
55
+ }
56
+ popupCharStylesEditorElem.style.opacity = '0';
57
+ popupCharStylesEditorElem.style.transform = 'translate(-10000px, -10000px)';
58
+ }, [anchorElemRef]);
59
+ var handleMouseDownFactory = useCallback(function (updateToolbar) {
60
+ return function (e) {
61
+ if (e.button === 0) {
62
+ // 0 is left mouse button
63
+ isMouseDownRef.current = true;
64
+ // Update toolbar when mouse is released
65
+ updateToolbar();
66
+ }
67
+ };
68
+ }, []);
69
+ var handleMouseUpFactory = useCallback(function (updateToolbar) {
70
+ return function (e) {
71
+ if (e.button === 0) {
72
+ // 0 is left mouse button
73
+ isMouseDownRef.current = false;
74
+ // Update toolbar when mouse is released
75
+ updateToolbar();
76
+ }
77
+ };
78
+ }, []);
47
79
  useLexicalEditor(function () {
48
80
  var service = kernelEditor.requireService(ILinkService);
49
81
  if (service) {
@@ -54,15 +86,39 @@ export var ReactToolbarPlugin = function ReactToolbarPlugin(_ref) {
54
86
  }
55
87
  }, []);
56
88
  useLexicalEditor(function (editor) {
57
- return mergeRegister(editor.registerUpdateListener(function (_ref2) {
58
- var editorState = _ref2.editorState;
59
- editorState.read(function () {
89
+ var handleMouseDown = handleMouseDownFactory(function () {
90
+ $hideFloatingToolbar();
91
+ });
92
+ var handleMouseUp = handleMouseUpFactory(function () {
93
+ editor.update(function () {
60
94
  $updateTextFormatFloatingToolbar(editor);
61
95
  });
96
+ });
97
+ var rootElement = editor.getRootElement();
98
+ if (rootElement) {
99
+ rootElement.addEventListener('mousedown', handleMouseDown);
100
+ rootElement.addEventListener('mouseup', handleMouseUp);
101
+ }
102
+ return mergeRegister(editor.registerUpdateListener(function (_ref2) {
103
+ var editorState = _ref2.editorState;
104
+ // Only update when mouse is not pressed
105
+ if (!isMouseDownRef.current) {
106
+ editorState.read(function () {
107
+ $updateTextFormatFloatingToolbar(editor);
108
+ });
109
+ }
62
110
  }), editor.registerCommand(SELECTION_CHANGE_COMMAND, function () {
63
- $updateTextFormatFloatingToolbar(editor);
111
+ // Only update when mouse is not pressed
112
+ if (!isMouseDownRef.current) {
113
+ $updateTextFormatFloatingToolbar(editor);
114
+ }
64
115
  return false;
65
- }, COMMAND_PRIORITY_LOW));
116
+ }, COMMAND_PRIORITY_LOW), function () {
117
+ if (rootElement) {
118
+ rootElement.removeEventListener('mousedown', handleMouseDown);
119
+ rootElement.removeEventListener('mouseup', handleMouseUp);
120
+ }
121
+ });
66
122
  });
67
123
  return /*#__PURE__*/_jsx("div", {
68
124
  ref: anchorElemRef,
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@lobehub/editor",
3
- "version": "1.26.1",
3
+ "version": "1.27.0",
4
4
  "description": "A powerful and extensible rich text editor built on Meta's Lexical framework, providing a modern editing experience with React integration.",
5
5
  "keywords": [
6
6
  "lobehub",