@lexical/react 0.1.7 → 0.1.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.
- package/DEPRECATED_useLexical.dev.js +84 -0
- package/DEPRECATED_useLexical.js +9 -2
- package/DEPRECATED_useLexical.prod.js +8 -0
- package/DEPRECATED_useLexicalAutoFormatter.dev.js +642 -0
- package/DEPRECATED_useLexicalAutoFormatter.js +9 -11
- package/DEPRECATED_useLexicalAutoFormatter.prod.js +22 -0
- package/DEPRECATED_useLexicalCanShowPlaceholder.dev.js +136 -0
- package/DEPRECATED_useLexicalCanShowPlaceholder.js +9 -3
- package/DEPRECATED_useLexicalCanShowPlaceholder.prod.js +8 -0
- package/DEPRECATED_useLexicalCharacterLimit.dev.js +294 -0
- package/DEPRECATED_useLexicalCharacterLimit.js +9 -8
- package/DEPRECATED_useLexicalCharacterLimit.prod.js +14 -0
- package/DEPRECATED_useLexicalDecorators.dev.js +82 -0
- package/DEPRECATED_useLexicalDecorators.js +9 -2
- package/DEPRECATED_useLexicalDecorators.prod.js +8 -0
- package/DEPRECATED_useLexicalEditor.dev.js +52 -0
- package/DEPRECATED_useLexicalEditor.js +9 -1
- package/DEPRECATED_useLexicalEditor.prod.js +7 -0
- package/DEPRECATED_useLexicalEditorEvents.dev.js +96 -0
- package/DEPRECATED_useLexicalEditorEvents.js +9 -2
- package/DEPRECATED_useLexicalEditorEvents.prod.js +8 -0
- package/DEPRECATED_useLexicalHistory.dev.js +339 -0
- package/DEPRECATED_useLexicalHistory.js +9 -7
- package/DEPRECATED_useLexicalHistory.prod.js +13 -0
- package/DEPRECATED_useLexicalList.dev.js +64 -0
- package/DEPRECATED_useLexicalList.js +9 -1
- package/DEPRECATED_useLexicalList.prod.js +7 -0
- package/DEPRECATED_useLexicalPlainText.dev.js +755 -0
- package/DEPRECATED_useLexicalPlainText.js +9 -16
- package/DEPRECATED_useLexicalPlainText.prod.js +22 -0
- package/DEPRECATED_useLexicalRichText.dev.js +1326 -0
- package/DEPRECATED_useLexicalRichText.js +9 -30
- package/DEPRECATED_useLexicalRichText.prod.js +35 -0
- package/LexicalAutoFormatterPlugin.dev.js +645 -0
- package/LexicalAutoFormatterPlugin.js +9 -12
- package/LexicalAutoFormatterPlugin.prod.js +23 -0
- package/LexicalAutoLinkPlugin.dev.js +227 -0
- package/LexicalAutoLinkPlugin.js +9 -6
- package/LexicalAutoLinkPlugin.prod.js +12 -0
- package/LexicalBootstrapPlugin.dev.js +124 -0
- package/LexicalBootstrapPlugin.js +9 -0
- package/LexicalBootstrapPlugin.prod.js +8 -0
- package/LexicalCharacterLimitPlugin.dev.js +352 -0
- package/LexicalCharacterLimitPlugin.js +9 -8
- package/LexicalCharacterLimitPlugin.prod.js +14 -0
- package/LexicalCollaborationPlugin.dev.js +235 -0
- package/LexicalCollaborationPlugin.js +9 -8
- package/LexicalCollaborationPlugin.prod.js +14 -0
- package/LexicalComposer.dev.js +76 -0
- package/LexicalComposer.js +9 -3
- package/LexicalComposer.prod.js +9 -0
- package/LexicalComposerContext.dev.js +53 -0
- package/LexicalComposerContext.js +9 -1
- package/LexicalComposerContext.prod.js +7 -0
- package/LexicalContentEditable.dev.js +71 -0
- package/LexicalContentEditable.js +9 -3
- package/LexicalContentEditable.prod.js +9 -0
- package/LexicalHashtagPlugin.dev.js +152 -0
- package/LexicalHashtagPlugin.js +9 -4
- package/LexicalHashtagPlugin.prod.js +10 -0
- package/LexicalHistoryPlugin.dev.js +344 -0
- package/LexicalHistoryPlugin.js +9 -7
- package/LexicalHistoryPlugin.prod.js +13 -0
- package/LexicalHorizontalRulePlugin.dev.js +51 -0
- package/LexicalHorizontalRulePlugin.js +9 -1
- package/LexicalHorizontalRulePlugin.prod.js +7 -0
- package/LexicalLinkPlugin.dev.js +137 -0
- package/LexicalLinkPlugin.js +9 -3
- package/LexicalLinkPlugin.prod.js +9 -0
- package/LexicalListPlugin.dev.js +67 -0
- package/LexicalListPlugin.js +9 -2
- package/LexicalListPlugin.prod.js +8 -0
- package/LexicalNestedComposer.dev.js +60 -0
- package/LexicalNestedComposer.js +9 -2
- package/LexicalNestedComposer.prod.js +8 -0
- package/LexicalOnChangePlugin.dev.js +57 -0
- package/LexicalOnChangePlugin.js +9 -1
- package/LexicalOnChangePlugin.prod.js +7 -0
- package/LexicalPlainTextPlugin.dev.js +565 -0
- package/LexicalPlainTextPlugin.js +9 -13
- package/LexicalPlainTextPlugin.prod.js +17 -0
- package/LexicalRichTextPlugin.dev.js +1136 -0
- package/LexicalRichTextPlugin.js +9 -27
- package/LexicalRichTextPlugin.prod.js +31 -0
- package/LexicalTablePlugin.dev.js +95 -0
- package/LexicalTablePlugin.js +9 -3
- package/LexicalTablePlugin.prod.js +9 -0
- package/LexicalTreeView.dev.js +340 -0
- package/LexicalTreeView.js +9 -13
- package/LexicalTreeView.prod.js +19 -0
- package/README.md +1 -0
- package/package.json +4 -4
- package/useLexicalDecoratorMap.dev.js +83 -0
- package/useLexicalDecoratorMap.js +9 -2
- package/useLexicalDecoratorMap.prod.js +8 -0
- package/useLexicalIsTextContentEmpty.dev.js +84 -0
- package/useLexicalIsTextContentEmpty.js +9 -2
- package/useLexicalIsTextContentEmpty.prod.js +8 -0
- package/withSubscriptions.dev.js +23 -0
- package/withSubscriptions.js +9 -1
- package/withSubscriptions.prod.js +7 -0
|
@@ -0,0 +1,565 @@
|
|
|
1
|
+
/**
|
|
2
|
+
* Copyright (c) Meta Platforms, Inc. and affiliates.
|
|
3
|
+
*
|
|
4
|
+
* This source code is licensed under the MIT license found in the
|
|
5
|
+
* LICENSE file in the root directory of this source tree.
|
|
6
|
+
*/
|
|
7
|
+
'use strict';
|
|
8
|
+
|
|
9
|
+
var LexicalComposerContext = require('@lexical/react/LexicalComposerContext');
|
|
10
|
+
var React = require('react');
|
|
11
|
+
var lexical = require('lexical');
|
|
12
|
+
var reactDom = require('react-dom');
|
|
13
|
+
|
|
14
|
+
/**
|
|
15
|
+
* Copyright (c) Meta Platforms, Inc. and affiliates.
|
|
16
|
+
*
|
|
17
|
+
* This source code is licensed under the MIT license found in the
|
|
18
|
+
* LICENSE file in the root directory of this source tree.
|
|
19
|
+
*
|
|
20
|
+
*
|
|
21
|
+
*/
|
|
22
|
+
function $textContent() {
|
|
23
|
+
const root = lexical.$getRoot();
|
|
24
|
+
return root.getTextContent();
|
|
25
|
+
}
|
|
26
|
+
function $isTextContentEmpty(isEditorComposing, trim = true) {
|
|
27
|
+
if (isEditorComposing) {
|
|
28
|
+
return false;
|
|
29
|
+
}
|
|
30
|
+
|
|
31
|
+
let text = $textContent();
|
|
32
|
+
|
|
33
|
+
if (trim) {
|
|
34
|
+
text = text.trim();
|
|
35
|
+
}
|
|
36
|
+
|
|
37
|
+
return text === '';
|
|
38
|
+
}
|
|
39
|
+
function $canShowPlaceholder(isComposing) {
|
|
40
|
+
if (!$isTextContentEmpty(isComposing, false)) {
|
|
41
|
+
return false;
|
|
42
|
+
}
|
|
43
|
+
|
|
44
|
+
const root = lexical.$getRoot();
|
|
45
|
+
const children = root.getChildren();
|
|
46
|
+
const childrenLength = children.length;
|
|
47
|
+
|
|
48
|
+
if (childrenLength > 1) {
|
|
49
|
+
return false;
|
|
50
|
+
}
|
|
51
|
+
|
|
52
|
+
for (let i = 0; i < childrenLength; i++) {
|
|
53
|
+
const topBlock = children[i];
|
|
54
|
+
|
|
55
|
+
if (lexical.$isElementNode(topBlock)) {
|
|
56
|
+
if (topBlock.__type !== 'paragraph') {
|
|
57
|
+
return false;
|
|
58
|
+
}
|
|
59
|
+
|
|
60
|
+
if (topBlock.__indent !== 0) {
|
|
61
|
+
return false;
|
|
62
|
+
}
|
|
63
|
+
|
|
64
|
+
const topBlockChildren = topBlock.getChildren();
|
|
65
|
+
const topBlockChildrenLength = topBlockChildren.length;
|
|
66
|
+
|
|
67
|
+
for (let s = 0; s < topBlockChildrenLength; s++) {
|
|
68
|
+
const child = topBlockChildren[i];
|
|
69
|
+
|
|
70
|
+
if (!lexical.$isTextNode(child)) {
|
|
71
|
+
return false;
|
|
72
|
+
}
|
|
73
|
+
}
|
|
74
|
+
}
|
|
75
|
+
}
|
|
76
|
+
|
|
77
|
+
return true;
|
|
78
|
+
}
|
|
79
|
+
function $canShowPlaceholderCurry(isEditorComposing) {
|
|
80
|
+
return () => $canShowPlaceholder(isEditorComposing);
|
|
81
|
+
}
|
|
82
|
+
|
|
83
|
+
/**
|
|
84
|
+
* Copyright (c) Meta Platforms, Inc. and affiliates.
|
|
85
|
+
*
|
|
86
|
+
* This source code is licensed under the MIT license found in the
|
|
87
|
+
* LICENSE file in the root directory of this source tree.
|
|
88
|
+
*
|
|
89
|
+
*
|
|
90
|
+
*/
|
|
91
|
+
const CAN_USE_DOM = typeof window !== 'undefined' && typeof window.document !== 'undefined' && typeof window.document.createElement !== 'undefined';
|
|
92
|
+
|
|
93
|
+
/**
|
|
94
|
+
* Copyright (c) Meta Platforms, Inc. and affiliates.
|
|
95
|
+
*
|
|
96
|
+
* This source code is licensed under the MIT license found in the
|
|
97
|
+
* LICENSE file in the root directory of this source tree.
|
|
98
|
+
*
|
|
99
|
+
*
|
|
100
|
+
*/
|
|
101
|
+
const useLayoutEffectImpl = CAN_USE_DOM ? React.useLayoutEffect : React.useEffect;
|
|
102
|
+
var useLayoutEffect = useLayoutEffectImpl;
|
|
103
|
+
|
|
104
|
+
/**
|
|
105
|
+
* Copyright (c) Meta Platforms, Inc. and affiliates.
|
|
106
|
+
*
|
|
107
|
+
* This source code is licensed under the MIT license found in the
|
|
108
|
+
* LICENSE file in the root directory of this source tree.
|
|
109
|
+
*
|
|
110
|
+
*
|
|
111
|
+
*/
|
|
112
|
+
function useLexicalCanShowPlaceholder(editor) {
|
|
113
|
+
const [canShowPlaceholder, setCanShowPlaceholder] = React.useState(editor.getEditorState().read($canShowPlaceholderCurry(editor.isComposing())));
|
|
114
|
+
useLayoutEffect(() => {
|
|
115
|
+
return editor.addListener('update', ({
|
|
116
|
+
editorState
|
|
117
|
+
}) => {
|
|
118
|
+
const isComposing = editor.isComposing();
|
|
119
|
+
const currentCanShowPlaceholder = editorState.read($canShowPlaceholderCurry(isComposing));
|
|
120
|
+
setCanShowPlaceholder(currentCanShowPlaceholder);
|
|
121
|
+
});
|
|
122
|
+
}, [editor]);
|
|
123
|
+
return canShowPlaceholder;
|
|
124
|
+
}
|
|
125
|
+
|
|
126
|
+
/**
|
|
127
|
+
* Copyright (c) Meta Platforms, Inc. and affiliates.
|
|
128
|
+
*
|
|
129
|
+
* This source code is licensed under the MIT license found in the
|
|
130
|
+
* LICENSE file in the root directory of this source tree.
|
|
131
|
+
*
|
|
132
|
+
*
|
|
133
|
+
*/
|
|
134
|
+
function useDecorators(editor) {
|
|
135
|
+
const [decorators, setDecorators] = React.useState(() => editor.getDecorators()); // Subscribe to changes
|
|
136
|
+
|
|
137
|
+
useLayoutEffect(() => {
|
|
138
|
+
return editor.addListener('decorator', nextDecorators => {
|
|
139
|
+
reactDom.flushSync(() => {
|
|
140
|
+
setDecorators(nextDecorators);
|
|
141
|
+
});
|
|
142
|
+
});
|
|
143
|
+
}, [editor]); // Return decorators defined as React Portals
|
|
144
|
+
|
|
145
|
+
return React.useMemo(() => {
|
|
146
|
+
const decoratedPortals = [];
|
|
147
|
+
const decoratorKeys = Object.keys(decorators);
|
|
148
|
+
|
|
149
|
+
for (let i = 0; i < decoratorKeys.length; i++) {
|
|
150
|
+
const nodeKey = decoratorKeys[i];
|
|
151
|
+
const reactDecorator = decorators[nodeKey];
|
|
152
|
+
const element = editor.getElementByKey(nodeKey);
|
|
153
|
+
|
|
154
|
+
if (element !== null) {
|
|
155
|
+
decoratedPortals.push( /*#__PURE__*/reactDom.createPortal(reactDecorator, element));
|
|
156
|
+
}
|
|
157
|
+
}
|
|
158
|
+
|
|
159
|
+
return decoratedPortals;
|
|
160
|
+
}, [decorators, editor]);
|
|
161
|
+
}
|
|
162
|
+
|
|
163
|
+
/**
|
|
164
|
+
* Copyright (c) Meta Platforms, Inc. and affiliates.
|
|
165
|
+
*
|
|
166
|
+
* This source code is licensed under the MIT license found in the
|
|
167
|
+
* LICENSE file in the root directory of this source tree.
|
|
168
|
+
*
|
|
169
|
+
*
|
|
170
|
+
*/
|
|
171
|
+
|
|
172
|
+
function $moveCaretSelection(selection, isHoldingShift, isBackward, granularity) {
|
|
173
|
+
selection.modify(isHoldingShift ? 'extend' : 'move', isBackward, granularity);
|
|
174
|
+
}
|
|
175
|
+
function $isParentElementRTL(selection) {
|
|
176
|
+
const anchorNode = selection.anchor.getNode();
|
|
177
|
+
const parent = anchorNode.getParentOrThrow();
|
|
178
|
+
return parent.getDirection() === 'rtl';
|
|
179
|
+
}
|
|
180
|
+
function $moveCharacter(selection, isHoldingShift, isBackward) {
|
|
181
|
+
const isRTL = $isParentElementRTL(selection);
|
|
182
|
+
$moveCaretSelection(selection, isHoldingShift, isBackward ? !isRTL : isRTL, 'character');
|
|
183
|
+
}
|
|
184
|
+
|
|
185
|
+
/**
|
|
186
|
+
* Copyright (c) Meta Platforms, Inc. and affiliates.
|
|
187
|
+
*
|
|
188
|
+
* This source code is licensed under the MIT license found in the
|
|
189
|
+
* LICENSE file in the root directory of this source tree.
|
|
190
|
+
*
|
|
191
|
+
*
|
|
192
|
+
*/
|
|
193
|
+
function getPossibleDecoratorNode(focus, isBackward) {
|
|
194
|
+
const focusOffset = focus.offset;
|
|
195
|
+
|
|
196
|
+
if (focus.type === 'element') {
|
|
197
|
+
const block = focus.getNode();
|
|
198
|
+
return block.getChildAtIndex(isBackward ? focusOffset - 1 : focusOffset);
|
|
199
|
+
} else {
|
|
200
|
+
const focusNode = focus.getNode();
|
|
201
|
+
|
|
202
|
+
if (isBackward && focusOffset === 0 || !isBackward && focusOffset === focusNode.getTextContentSize()) {
|
|
203
|
+
return isBackward ? focusNode.getPreviousSibling() : focusNode.getNextSibling();
|
|
204
|
+
}
|
|
205
|
+
}
|
|
206
|
+
|
|
207
|
+
return null;
|
|
208
|
+
}
|
|
209
|
+
|
|
210
|
+
/**
|
|
211
|
+
* Copyright (c) Meta Platforms, Inc. and affiliates.
|
|
212
|
+
*
|
|
213
|
+
* This source code is licensed under the MIT license found in the
|
|
214
|
+
* LICENSE file in the root directory of this source tree.
|
|
215
|
+
*
|
|
216
|
+
*
|
|
217
|
+
*/
|
|
218
|
+
function $insertDataTransferForPlainText(dataTransfer, selection) {
|
|
219
|
+
const text = dataTransfer.getData('text/plain');
|
|
220
|
+
|
|
221
|
+
if (text != null) {
|
|
222
|
+
selection.insertRawText(text);
|
|
223
|
+
}
|
|
224
|
+
}
|
|
225
|
+
function $shouldOverrideDefaultCharacterSelection(selection, isBackward) {
|
|
226
|
+
const possibleDecoratorNode = getPossibleDecoratorNode(selection.focus, isBackward);
|
|
227
|
+
return lexical.$isDecoratorNode(possibleDecoratorNode);
|
|
228
|
+
}
|
|
229
|
+
function onPasteForPlainText(event, editor) {
|
|
230
|
+
event.preventDefault();
|
|
231
|
+
editor.update(() => {
|
|
232
|
+
lexical.$log('onPasteForPlainText');
|
|
233
|
+
const selection = lexical.$getSelection();
|
|
234
|
+
const clipboardData = event.clipboardData;
|
|
235
|
+
|
|
236
|
+
if (clipboardData != null && selection !== null) {
|
|
237
|
+
$insertDataTransferForPlainText(clipboardData, selection);
|
|
238
|
+
}
|
|
239
|
+
});
|
|
240
|
+
}
|
|
241
|
+
function onCutForPlainText(event, editor) {
|
|
242
|
+
onCopyForPlainText(event, editor);
|
|
243
|
+
editor.update(() => {
|
|
244
|
+
lexical.$log('onCutForPlainText');
|
|
245
|
+
const selection = lexical.$getSelection();
|
|
246
|
+
|
|
247
|
+
if (selection !== null) {
|
|
248
|
+
selection.removeText();
|
|
249
|
+
}
|
|
250
|
+
});
|
|
251
|
+
}
|
|
252
|
+
function onCopyForPlainText(event, editor) {
|
|
253
|
+
event.preventDefault();
|
|
254
|
+
editor.update(() => {
|
|
255
|
+
lexical.$log('onCopyForPlainText');
|
|
256
|
+
const clipboardData = event.clipboardData;
|
|
257
|
+
const selection = lexical.$getSelection();
|
|
258
|
+
|
|
259
|
+
if (selection !== null) {
|
|
260
|
+
if (clipboardData != null) {
|
|
261
|
+
const domSelection = window.getSelection(); // If we haven't selected a range, then don't copy anything
|
|
262
|
+
|
|
263
|
+
if (domSelection.isCollapsed) {
|
|
264
|
+
return;
|
|
265
|
+
}
|
|
266
|
+
|
|
267
|
+
const range = domSelection.getRangeAt(0);
|
|
268
|
+
|
|
269
|
+
if (range) {
|
|
270
|
+
const container = document.createElement('div');
|
|
271
|
+
const frag = range.cloneContents();
|
|
272
|
+
container.appendChild(frag);
|
|
273
|
+
clipboardData.setData('text/html', container.innerHTML);
|
|
274
|
+
}
|
|
275
|
+
|
|
276
|
+
clipboardData.setData('text/plain', selection.getTextContent());
|
|
277
|
+
}
|
|
278
|
+
}
|
|
279
|
+
});
|
|
280
|
+
}
|
|
281
|
+
|
|
282
|
+
/**
|
|
283
|
+
* Copyright (c) Meta Platforms, Inc. and affiliates.
|
|
284
|
+
*
|
|
285
|
+
* This source code is licensed under the MIT license found in the
|
|
286
|
+
* LICENSE file in the root directory of this source tree.
|
|
287
|
+
*
|
|
288
|
+
*
|
|
289
|
+
*/
|
|
290
|
+
function useLexicalDragonSupport(editor) {
|
|
291
|
+
React.useEffect(() => {
|
|
292
|
+
const handler = event => {
|
|
293
|
+
const rootElement = editor.getRootElement();
|
|
294
|
+
|
|
295
|
+
if (document.activeElement !== rootElement) {
|
|
296
|
+
return;
|
|
297
|
+
}
|
|
298
|
+
|
|
299
|
+
const data = event.data;
|
|
300
|
+
|
|
301
|
+
if (typeof data === 'string') {
|
|
302
|
+
let parsedData;
|
|
303
|
+
|
|
304
|
+
try {
|
|
305
|
+
parsedData = JSON.parse(data);
|
|
306
|
+
} catch (e) {
|
|
307
|
+
return;
|
|
308
|
+
}
|
|
309
|
+
|
|
310
|
+
if (parsedData && parsedData.protocol === 'nuanria_messaging' && parsedData.type === 'request') {
|
|
311
|
+
const payload = parsedData.payload;
|
|
312
|
+
|
|
313
|
+
if (payload && payload.functionId === 'makeChanges') {
|
|
314
|
+
const args = payload.args;
|
|
315
|
+
|
|
316
|
+
if (args) {
|
|
317
|
+
const [elementStart, elementLength, text, selStart, selLength, formatCommand] = args; // TODO: we should probably handle formatCommand somehow?
|
|
318
|
+
editor.update(() => {
|
|
319
|
+
lexical.$log('useLexicalDragonSupport');
|
|
320
|
+
const selection = lexical.$getSelection();
|
|
321
|
+
|
|
322
|
+
if (selection !== null) {
|
|
323
|
+
const anchor = selection.anchor;
|
|
324
|
+
let anchorNode = anchor.getNode();
|
|
325
|
+
let setSelStart = 0;
|
|
326
|
+
let setSelEnd = 0;
|
|
327
|
+
|
|
328
|
+
if (lexical.$isTextNode(anchorNode)) {
|
|
329
|
+
// set initial selection
|
|
330
|
+
if (elementStart >= 0 && elementLength >= 0) {
|
|
331
|
+
setSelStart = elementStart;
|
|
332
|
+
setSelEnd = elementStart + elementLength; // If the offset is more than the end, make it the end
|
|
333
|
+
|
|
334
|
+
selection.setTextNodeRange(anchorNode, setSelStart, anchorNode, setSelEnd);
|
|
335
|
+
}
|
|
336
|
+
}
|
|
337
|
+
|
|
338
|
+
if (setSelStart !== setSelEnd || text !== '') {
|
|
339
|
+
selection.insertRawText(text);
|
|
340
|
+
anchorNode = anchor.getNode();
|
|
341
|
+
}
|
|
342
|
+
|
|
343
|
+
if (lexical.$isTextNode(anchorNode)) {
|
|
344
|
+
// set final selection
|
|
345
|
+
setSelStart = selStart;
|
|
346
|
+
setSelEnd = selStart + selLength;
|
|
347
|
+
const anchorNodeTextLength = anchorNode.getTextContentSize(); // If the offset is more than the end, make it the end
|
|
348
|
+
|
|
349
|
+
setSelStart = setSelStart > anchorNodeTextLength ? anchorNodeTextLength : setSelStart;
|
|
350
|
+
setSelEnd = setSelEnd > anchorNodeTextLength ? anchorNodeTextLength : setSelEnd;
|
|
351
|
+
selection.setTextNodeRange(anchorNode, setSelStart, anchorNode, setSelEnd);
|
|
352
|
+
} // block the chrome extension from handling this event
|
|
353
|
+
|
|
354
|
+
|
|
355
|
+
event.stopImmediatePropagation();
|
|
356
|
+
}
|
|
357
|
+
});
|
|
358
|
+
}
|
|
359
|
+
}
|
|
360
|
+
}
|
|
361
|
+
}
|
|
362
|
+
};
|
|
363
|
+
|
|
364
|
+
window.addEventListener('message', handler, true);
|
|
365
|
+
return () => {
|
|
366
|
+
window.removeEventListener('message', handler, true);
|
|
367
|
+
};
|
|
368
|
+
}, [editor]);
|
|
369
|
+
}
|
|
370
|
+
|
|
371
|
+
/**
|
|
372
|
+
* Copyright (c) Meta Platforms, Inc. and affiliates.
|
|
373
|
+
*
|
|
374
|
+
* This source code is licensed under the MIT license found in the
|
|
375
|
+
* LICENSE file in the root directory of this source tree.
|
|
376
|
+
*
|
|
377
|
+
*
|
|
378
|
+
*/
|
|
379
|
+
const EditorPriority = 0;
|
|
380
|
+
function usePlainTextSetup(editor) {
|
|
381
|
+
useLayoutEffect(() => {
|
|
382
|
+
const removeListener = editor.addListener('command', (type, payload) => {
|
|
383
|
+
const selection = lexical.$getSelection();
|
|
384
|
+
|
|
385
|
+
if (selection === null) {
|
|
386
|
+
return false;
|
|
387
|
+
}
|
|
388
|
+
|
|
389
|
+
switch (type) {
|
|
390
|
+
case 'deleteCharacter':
|
|
391
|
+
{
|
|
392
|
+
const isBackward = payload;
|
|
393
|
+
selection.deleteCharacter(isBackward);
|
|
394
|
+
return true;
|
|
395
|
+
}
|
|
396
|
+
|
|
397
|
+
case 'deleteWord':
|
|
398
|
+
{
|
|
399
|
+
const isBackward = payload;
|
|
400
|
+
selection.deleteWord(isBackward);
|
|
401
|
+
return true;
|
|
402
|
+
}
|
|
403
|
+
|
|
404
|
+
case 'deleteLine':
|
|
405
|
+
{
|
|
406
|
+
const isBackward = payload;
|
|
407
|
+
selection.deleteLine(isBackward);
|
|
408
|
+
return true;
|
|
409
|
+
}
|
|
410
|
+
|
|
411
|
+
case 'insertText':
|
|
412
|
+
{
|
|
413
|
+
const eventOrText = payload;
|
|
414
|
+
|
|
415
|
+
if (typeof eventOrText === 'string') {
|
|
416
|
+
selection.insertText(eventOrText);
|
|
417
|
+
} else {
|
|
418
|
+
const dataTransfer = eventOrText.dataTransfer;
|
|
419
|
+
|
|
420
|
+
if (dataTransfer != null) {
|
|
421
|
+
$insertDataTransferForPlainText(dataTransfer, selection);
|
|
422
|
+
} else {
|
|
423
|
+
const data = eventOrText.data;
|
|
424
|
+
|
|
425
|
+
if (data) {
|
|
426
|
+
selection.insertText(data);
|
|
427
|
+
}
|
|
428
|
+
}
|
|
429
|
+
}
|
|
430
|
+
|
|
431
|
+
return true;
|
|
432
|
+
}
|
|
433
|
+
|
|
434
|
+
case 'removeText':
|
|
435
|
+
selection.removeText();
|
|
436
|
+
return true;
|
|
437
|
+
|
|
438
|
+
case 'insertLineBreak':
|
|
439
|
+
const selectStart = payload;
|
|
440
|
+
selection.insertLineBreak(selectStart);
|
|
441
|
+
return true;
|
|
442
|
+
|
|
443
|
+
case 'insertParagraph':
|
|
444
|
+
selection.insertLineBreak();
|
|
445
|
+
return true;
|
|
446
|
+
|
|
447
|
+
case 'indentContent':
|
|
448
|
+
case 'outdentContent':
|
|
449
|
+
case 'insertHorizontalRule':
|
|
450
|
+
case 'insertImage':
|
|
451
|
+
case 'insertTable':
|
|
452
|
+
case 'formatElement':
|
|
453
|
+
case 'formatText':
|
|
454
|
+
{
|
|
455
|
+
return true;
|
|
456
|
+
}
|
|
457
|
+
|
|
458
|
+
case 'keyArrowLeft':
|
|
459
|
+
{
|
|
460
|
+
const event = payload;
|
|
461
|
+
const isHoldingShift = event.shiftKey;
|
|
462
|
+
|
|
463
|
+
if ($shouldOverrideDefaultCharacterSelection(selection, true)) {
|
|
464
|
+
event.preventDefault();
|
|
465
|
+
$moveCharacter(selection, isHoldingShift, true);
|
|
466
|
+
return true;
|
|
467
|
+
}
|
|
468
|
+
|
|
469
|
+
return false;
|
|
470
|
+
}
|
|
471
|
+
|
|
472
|
+
case 'keyArrowRight':
|
|
473
|
+
{
|
|
474
|
+
const event = payload;
|
|
475
|
+
const isHoldingShift = event.shiftKey;
|
|
476
|
+
|
|
477
|
+
if ($shouldOverrideDefaultCharacterSelection(selection, false)) {
|
|
478
|
+
event.preventDefault();
|
|
479
|
+
$moveCharacter(selection, isHoldingShift, false);
|
|
480
|
+
return true;
|
|
481
|
+
}
|
|
482
|
+
|
|
483
|
+
return false;
|
|
484
|
+
}
|
|
485
|
+
|
|
486
|
+
case 'keyBackspace':
|
|
487
|
+
{
|
|
488
|
+
const event = payload;
|
|
489
|
+
event.preventDefault();
|
|
490
|
+
return editor.execCommand('deleteCharacter', true);
|
|
491
|
+
}
|
|
492
|
+
|
|
493
|
+
case 'keyDelete':
|
|
494
|
+
{
|
|
495
|
+
const event = payload;
|
|
496
|
+
event.preventDefault();
|
|
497
|
+
return editor.execCommand('deleteCharacter', false);
|
|
498
|
+
}
|
|
499
|
+
|
|
500
|
+
case 'keyEnter':
|
|
501
|
+
{
|
|
502
|
+
const event = payload;
|
|
503
|
+
event.preventDefault();
|
|
504
|
+
return editor.execCommand('insertLineBreak');
|
|
505
|
+
}
|
|
506
|
+
|
|
507
|
+
case 'copy':
|
|
508
|
+
{
|
|
509
|
+
const event = payload;
|
|
510
|
+
onCopyForPlainText(event, editor);
|
|
511
|
+
return true;
|
|
512
|
+
}
|
|
513
|
+
|
|
514
|
+
case 'cut':
|
|
515
|
+
{
|
|
516
|
+
const event = payload;
|
|
517
|
+
onCutForPlainText(event, editor);
|
|
518
|
+
return true;
|
|
519
|
+
}
|
|
520
|
+
|
|
521
|
+
case 'paste':
|
|
522
|
+
{
|
|
523
|
+
const event = payload;
|
|
524
|
+
onPasteForPlainText(event, editor);
|
|
525
|
+
return true;
|
|
526
|
+
}
|
|
527
|
+
|
|
528
|
+
case 'drop':
|
|
529
|
+
case 'dragstart':
|
|
530
|
+
{
|
|
531
|
+
// TODO: Make drag and drop work at some point.
|
|
532
|
+
const event = payload;
|
|
533
|
+
event.preventDefault();
|
|
534
|
+
return true;
|
|
535
|
+
}
|
|
536
|
+
}
|
|
537
|
+
|
|
538
|
+
return false;
|
|
539
|
+
}, EditorPriority);
|
|
540
|
+
editor.execCommand('bootstrapEditor');
|
|
541
|
+
return removeListener;
|
|
542
|
+
}, [editor]);
|
|
543
|
+
useLexicalDragonSupport(editor);
|
|
544
|
+
}
|
|
545
|
+
|
|
546
|
+
/**
|
|
547
|
+
* Copyright (c) Meta Platforms, Inc. and affiliates.
|
|
548
|
+
*
|
|
549
|
+
* This source code is licensed under the MIT license found in the
|
|
550
|
+
* LICENSE file in the root directory of this source tree.
|
|
551
|
+
*
|
|
552
|
+
*
|
|
553
|
+
*/
|
|
554
|
+
function PlainTextPlugin({
|
|
555
|
+
contentEditable,
|
|
556
|
+
placeholder
|
|
557
|
+
}) {
|
|
558
|
+
const [editor] = LexicalComposerContext.useLexicalComposerContext();
|
|
559
|
+
const showPlaceholder = useLexicalCanShowPlaceholder(editor);
|
|
560
|
+
usePlainTextSetup(editor);
|
|
561
|
+
const decorators = useDecorators(editor);
|
|
562
|
+
return /*#__PURE__*/React.createElement(React.Fragment, null, contentEditable, showPlaceholder && placeholder, decorators);
|
|
563
|
+
}
|
|
564
|
+
|
|
565
|
+
module.exports = PlainTextPlugin;
|
|
@@ -1,13 +1,9 @@
|
|
|
1
|
-
|
|
2
|
-
|
|
3
|
-
|
|
4
|
-
|
|
5
|
-
|
|
6
|
-
|
|
7
|
-
|
|
8
|
-
|
|
9
|
-
|
|
10
|
-
"move",e,"character"),!0;break;case "keyBackspace":return b.preventDefault(),a.execCommand("deleteCharacter",!0);case "keyDelete":return b.preventDefault(),a.execCommand("deleteCharacter",!1);case "keyEnter":return b.preventDefault(),a.execCommand("insertLineBreak");case "clearEditor":H(a);break;case "copy":return C(b,a),!0;case "cut":return B(b,a),!0;case "paste":return A(b,a),!0;case "drop":case "dragstart":return b.preventDefault(),!0}return!1},0));d&&G(a);return c},[a,d]);x(a)}
|
|
11
|
-
function J(a){const [d,c]=g.useState(()=>a.getDecorators());D(()=>a.addListener("decorator",e=>{w.flushSync(()=>{c(e)})}),[a]);return g.useMemo(()=>{const e=[],b=Object.keys(d);for(let p=0;p<b.length;p++){var f=b[p];const r=d[f];f=a.getElementByKey(f);null!==f&&e.push(w.createPortal(r,f))}return e},[d,a])}function K(a,d=!0){if(a)return!1;a=t.$getRoot().getTextContent();d&&(a=a.trim());return""===a}
|
|
12
|
-
function L(a){if(!K(a,!1))return!1;a=t.$getRoot().getChildren();const d=a.length;if(1<d)return!1;for(let e=0;e<d;e++){var c=a[e];if(t.$isElementNode(c)){if("paragraph"!==c.__type||0!==c.__indent)return!1;c=c.getChildren();const b=c.length;for(let f=0;f<b;f++)if(!t.$isTextNode(c[e]))return!1}}return!0}function M(a){return()=>L(a)}
|
|
13
|
-
function N(a){const [d,c]=g.useState(a.getEditorState().read(M(a.isComposing())));D(()=>a.addListener("update",({editorState:e})=>{const b=a.isComposing();e=e.read(M(b));c(e)}),[a]);return d}module.exports=function({contentEditable:a,placeholder:d,skipInit:c}){const [e]=h.useLexicalComposerContext(),b=N(e);I(e,!c);c=J(e);return g.createElement(g.Fragment,null,a,b&&d,c)};
|
|
1
|
+
/**
|
|
2
|
+
* Copyright (c) Meta Platforms, Inc. and affiliates.
|
|
3
|
+
*
|
|
4
|
+
* This source code is licensed under the MIT license found in the
|
|
5
|
+
* LICENSE file in the root directory of this source tree.
|
|
6
|
+
*/
|
|
7
|
+
'use strict'
|
|
8
|
+
const LexicalPlainTextPlugin = process.env.NODE_ENV === 'development' ? require('./LexicalPlainTextPlugin.dev.js') : require('./LexicalPlainTextPlugin.prod.js')
|
|
9
|
+
module.exports = LexicalPlainTextPlugin;
|
|
@@ -0,0 +1,17 @@
|
|
|
1
|
+
/**
|
|
2
|
+
* Copyright (c) Meta Platforms, Inc. and affiliates.
|
|
3
|
+
*
|
|
4
|
+
* This source code is licensed under the MIT license found in the
|
|
5
|
+
* LICENSE file in the root directory of this source tree.
|
|
6
|
+
*/
|
|
7
|
+
'use strict';var g=require("@lexical/react/LexicalComposerContext"),h=require("react"),t=require("lexical"),u=require("react-dom");function v(a,e=!0){if(a)return!1;a=t.$getRoot().getTextContent();e&&(a=a.trim());return""===a}
|
|
8
|
+
function w(a){if(!v(a,!1))return!1;a=t.$getRoot().getChildren();const e=a.length;if(1<e)return!1;for(let b=0;b<e;b++){var c=a[b];if(t.$isElementNode(c)){if("paragraph"!==c.__type||0!==c.__indent)return!1;c=c.getChildren();const d=c.length;for(let f=0;f<d;f++)if(!t.$isTextNode(c[b]))return!1}}return!0}function x(a){return()=>w(a)}var y="undefined"!==typeof window&&"undefined"!==typeof window.document&&"undefined"!==typeof window.document.createElement?h.useLayoutEffect:h.useEffect;
|
|
9
|
+
function A(a){const [e,c]=h.useState(a.getEditorState().read(x(a.isComposing())));y(()=>a.addListener("update",({editorState:b})=>{const d=a.isComposing();b=b.read(x(d));c(b)}),[a]);return e}function B(a){const [e,c]=h.useState(()=>a.getDecorators());y(()=>a.addListener("decorator",b=>{u.flushSync(()=>{c(b)})}),[a]);return h.useMemo(()=>{const b=[],d=Object.keys(e);for(let p=0;p<d.length;p++){var f=d[p];const r=e[f];f=a.getElementByKey(f);null!==f&&b.push(u.createPortal(r,f))}return b},[e,a])}
|
|
10
|
+
function C(a,e){a=a.getData("text/plain");null!=a&&e.insertRawText(a)}function D(a,e){var c=a.focus;a=c.offset;"element"===c.type?e=c.getNode().getChildAtIndex(e?a-1:a):(c=c.getNode(),e=e&&0===a||!e&&a===c.getTextContentSize()?e?c.getPreviousSibling():c.getNextSibling():null);return t.$isDecoratorNode(e)}function E(a,e){a.preventDefault();e.update(()=>{t.$log("onPasteForPlainText");const c=t.$getSelection(),b=a.clipboardData;null!=b&&null!==c&&C(b,c)})}
|
|
11
|
+
function F(a,e){G(a,e);e.update(()=>{t.$log("onCutForPlainText");const c=t.$getSelection();null!==c&&c.removeText()})}function G(a,e){a.preventDefault();e.update(()=>{t.$log("onCopyForPlainText");const c=a.clipboardData,b=t.$getSelection();if(null!==b&&null!=c){var d=window.getSelection();if(!d.isCollapsed){var f=d.getRangeAt(0);f&&(d=document.createElement("div"),f=f.cloneContents(),d.appendChild(f),c.setData("text/html",d.innerHTML));c.setData("text/plain",b.getTextContent())}}})}
|
|
12
|
+
function H(a){h.useEffect(()=>{const e=c=>{var b=a.getRootElement();if(document.activeElement===b&&(b=c.data,"string"===typeof b)){try{var d=JSON.parse(b)}catch(f){return}if(d&&"nuanria_messaging"===d.protocol&&"request"===d.type&&(d=d.payload)&&"makeChanges"===d.functionId&&(d=d.args)){const [f,p,r,z,I]=d;a.update(()=>{t.$log("useLexicalDragonSupport");const q=t.$getSelection();if(null!==q){var n=q.anchor;let k=n.getNode(),l=0,m=0;t.$isTextNode(k)&&0<=f&&0<=p&&(l=f,m=f+p,q.setTextNodeRange(k,l,k,
|
|
13
|
+
m));if(l!==m||""!==r)q.insertRawText(r),k=n.getNode();t.$isTextNode(k)&&(l=z,m=z+I,n=k.getTextContentSize(),l=l>n?n:l,m=m>n?n:m,q.setTextNodeRange(k,l,k,m));c.stopImmediatePropagation()}})}}};window.addEventListener("message",e,!0);return()=>{window.removeEventListener("message",e,!0)}},[a])}
|
|
14
|
+
function J(a){y(()=>{const e=a.addListener("command",(c,b)=>{const d=t.$getSelection();if(null===d)return!1;switch(c){case "deleteCharacter":return d.deleteCharacter(b),!0;case "deleteWord":return d.deleteWord(b),!0;case "deleteLine":return d.deleteLine(b),!0;case "insertText":return"string"===typeof b?d.insertText(b):(c=b.dataTransfer,null!=c?C(c,d):(b=b.data)&&d.insertText(b)),!0;case "removeText":return d.removeText(),!0;case "insertLineBreak":return d.insertLineBreak(b),!0;case "insertParagraph":return d.insertLineBreak(),
|
|
15
|
+
!0;case "indentContent":case "outdentContent":case "insertHorizontalRule":case "insertImage":case "insertTable":case "formatElement":case "formatText":return!0;case "keyArrowLeft":c=b.shiftKey;if(D(d,!0))return b.preventDefault(),b=c,c="rtl"===d.anchor.getNode().getParentOrThrow().getDirection(),d.modify(b?"extend":"move",!c,"character"),!0;break;case "keyArrowRight":c=b.shiftKey;if(D(d,!1))return b.preventDefault(),b=c,c="rtl"===d.anchor.getNode().getParentOrThrow().getDirection(),d.modify(b?"extend":
|
|
16
|
+
"move",c,"character"),!0;break;case "keyBackspace":return b.preventDefault(),a.execCommand("deleteCharacter",!0);case "keyDelete":return b.preventDefault(),a.execCommand("deleteCharacter",!1);case "keyEnter":return b.preventDefault(),a.execCommand("insertLineBreak");case "copy":return G(b,a),!0;case "cut":return F(b,a),!0;case "paste":return E(b,a),!0;case "drop":case "dragstart":return b.preventDefault(),!0}return!1},0);a.execCommand("bootstrapEditor");return e},[a]);H(a)}
|
|
17
|
+
module.exports=function({contentEditable:a,placeholder:e}){var [c]=g.useLexicalComposerContext();const b=A(c);J(c);c=B(c);return h.createElement(h.Fragment,null,a,b&&e,c)};
|