@lexical/react 0.3.7 → 0.3.10

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 (35) hide show
  1. package/LexicalAutoEmbedPlugin.d.ts +46 -0
  2. package/LexicalAutoEmbedPlugin.dev.js +490 -0
  3. package/LexicalAutoEmbedPlugin.js +9 -0
  4. package/LexicalAutoEmbedPlugin.prod.js +21 -0
  5. package/LexicalAutoLinkPlugin.dev.js +1 -1
  6. package/LexicalAutoLinkPlugin.prod.js +2 -2
  7. package/LexicalCollaborationContext.d.ts +19 -0
  8. package/LexicalCollaborationContext.dev.js +38 -0
  9. package/LexicalCollaborationContext.js +9 -0
  10. package/LexicalCollaborationContext.js.flow +21 -0
  11. package/LexicalCollaborationContext.prod.js +8 -0
  12. package/LexicalCollaborationPlugin.d.ts +0 -10
  13. package/LexicalCollaborationPlugin.dev.js +13 -20
  14. package/LexicalCollaborationPlugin.js.flow +0 -9
  15. package/LexicalCollaborationPlugin.prod.js +9 -10
  16. package/LexicalLinkPlugin.dev.js +15 -2
  17. package/LexicalLinkPlugin.prod.js +2 -1
  18. package/LexicalNestedComposer.dev.js +11 -5
  19. package/LexicalNestedComposer.prod.js +3 -3
  20. package/LexicalOnChangePlugin.d.ts +2 -1
  21. package/LexicalOnChangePlugin.dev.js +6 -3
  22. package/LexicalOnChangePlugin.js.flow +2 -0
  23. package/LexicalOnChangePlugin.prod.js +2 -2
  24. package/LexicalTableOfContents__EXPERIMENTAL.d.ts +14 -0
  25. package/LexicalTableOfContents__EXPERIMENTAL.dev.js +144 -0
  26. package/LexicalTableOfContents__EXPERIMENTAL.js +9 -0
  27. package/LexicalTableOfContents__EXPERIMENTAL.js.flow +17 -0
  28. package/LexicalTableOfContents__EXPERIMENTAL.prod.js +10 -0
  29. package/LexicalTreeView.dev.js +43 -9
  30. package/LexicalTreeView.prod.js +13 -13
  31. package/LexicalTypeaheadMenuPlugin.d.ts +52 -0
  32. package/LexicalTypeaheadMenuPlugin.dev.js +520 -0
  33. package/LexicalTypeaheadMenuPlugin.js +9 -0
  34. package/LexicalTypeaheadMenuPlugin.prod.js +22 -0
  35. package/package.json +19 -19
@@ -0,0 +1,520 @@
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 utils = require('@lexical/utils');
11
+ var lexical = require('lexical');
12
+ var React = require('react');
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
+ const CAN_USE_DOM = typeof window !== 'undefined' && typeof window.document !== 'undefined' && typeof window.document.createElement !== 'undefined';
22
+
23
+ /**
24
+ * Copyright (c) Meta Platforms, Inc. and affiliates.
25
+ *
26
+ * This source code is licensed under the MIT license found in the
27
+ * LICENSE file in the root directory of this source tree.
28
+ *
29
+ */
30
+ const useLayoutEffectImpl = CAN_USE_DOM ? React.useLayoutEffect : React.useEffect;
31
+ var useLayoutEffect = useLayoutEffectImpl;
32
+
33
+ /**
34
+ * Copyright (c) Meta Platforms, Inc. and affiliates.
35
+ *
36
+ * This source code is licensed under the MIT license found in the
37
+ * LICENSE file in the root directory of this source tree.
38
+ *
39
+ */
40
+ const PUNCTUATION = '\\.,\\+\\*\\?\\$\\@\\|#{}\\(\\)\\^\\-\\[\\]\\\\/!%\'"~=<>_:;';
41
+ class TypeaheadOption {
42
+ constructor(key) {
43
+ this.key = key;
44
+ this.ref = {
45
+ current: null
46
+ };
47
+ this.setRefElement = this.setRefElement.bind(this);
48
+ }
49
+
50
+ setRefElement(element) {
51
+ this.ref = {
52
+ current: element
53
+ };
54
+ }
55
+
56
+ }
57
+
58
+ const scrollIntoViewIfNeeded = target => {
59
+ const container = document.getElementById('typeahead-menu');
60
+
61
+ if (container) {
62
+ const containerRect = container.getBoundingClientRect();
63
+ const targetRect = target.getBoundingClientRect();
64
+
65
+ if (targetRect.bottom > containerRect.bottom) {
66
+ target.scrollIntoView(false);
67
+ } else if (targetRect.top < containerRect.top) {
68
+ target.scrollIntoView();
69
+ }
70
+ }
71
+ };
72
+
73
+ function getTextUpToAnchor(selection) {
74
+ const anchor = selection.anchor;
75
+
76
+ if (anchor.type !== 'text') {
77
+ return null;
78
+ }
79
+
80
+ const anchorNode = anchor.getNode();
81
+
82
+ if (!anchorNode.isSimpleText()) {
83
+ return null;
84
+ }
85
+
86
+ const anchorOffset = anchor.offset;
87
+ return anchorNode.getTextContent().slice(0, anchorOffset);
88
+ }
89
+
90
+ function tryToPositionRange(leadOffset, range) {
91
+ const domSelection = window.getSelection();
92
+
93
+ if (domSelection === null || !domSelection.isCollapsed) {
94
+ return false;
95
+ }
96
+
97
+ const anchorNode = domSelection.anchorNode;
98
+ const startOffset = leadOffset;
99
+ const endOffset = domSelection.anchorOffset;
100
+
101
+ if (anchorNode == null || endOffset == null) {
102
+ return false;
103
+ }
104
+
105
+ try {
106
+ range.setStart(anchorNode, startOffset);
107
+ range.setEnd(anchorNode, endOffset);
108
+ } catch (error) {
109
+ return false;
110
+ }
111
+
112
+ return true;
113
+ }
114
+
115
+ function getQueryTextForSearch(editor) {
116
+ let text = null;
117
+ editor.getEditorState().read(() => {
118
+ const selection = lexical.$getSelection();
119
+
120
+ if (!lexical.$isRangeSelection(selection)) {
121
+ return;
122
+ }
123
+
124
+ text = getTextUpToAnchor(selection);
125
+ });
126
+ return text;
127
+ }
128
+ /**
129
+ * Walk backwards along user input and forward through entity title to try
130
+ * and replace more of the user's text with entity.
131
+ */
132
+
133
+
134
+ function getFullMatchOffset(documentText, entryText, offset) {
135
+ let triggerOffset = offset;
136
+
137
+ for (let i = triggerOffset; i <= entryText.length; i++) {
138
+ if (documentText.substr(-i) === entryText.substr(0, i)) {
139
+ triggerOffset = i;
140
+ }
141
+ }
142
+
143
+ return triggerOffset;
144
+ }
145
+ /**
146
+ * Split Lexical TextNode and return a new TextNode only containing matched text.
147
+ * Common use cases include: removing the node, replacing with a new node.
148
+ */
149
+
150
+
151
+ function splitNodeContainingQuery(editor, match) {
152
+ const selection = lexical.$getSelection();
153
+
154
+ if (!lexical.$isRangeSelection(selection) || !selection.isCollapsed()) {
155
+ return null;
156
+ }
157
+
158
+ const anchor = selection.anchor;
159
+
160
+ if (anchor.type !== 'text') {
161
+ return null;
162
+ }
163
+
164
+ const anchorNode = anchor.getNode();
165
+
166
+ if (!anchorNode.isSimpleText()) {
167
+ return null;
168
+ }
169
+
170
+ const selectionOffset = anchor.offset;
171
+ const textContent = anchorNode.getTextContent().slice(0, selectionOffset);
172
+ const characterOffset = match.replaceableString.length;
173
+ const queryOffset = getFullMatchOffset(textContent, match.matchingString, characterOffset);
174
+ const startOffset = selectionOffset - queryOffset;
175
+
176
+ if (startOffset < 0) {
177
+ return null;
178
+ }
179
+
180
+ let newNode;
181
+
182
+ if (startOffset === 0) {
183
+ [newNode] = anchorNode.splitText(selectionOffset);
184
+ } else {
185
+ [, newNode] = anchorNode.splitText(startOffset, selectionOffset);
186
+ }
187
+
188
+ return newNode;
189
+ }
190
+
191
+ function isSelectionOnEntityBoundary(editor, offset) {
192
+ if (offset !== 0) {
193
+ return false;
194
+ }
195
+
196
+ return editor.getEditorState().read(() => {
197
+ const selection = lexical.$getSelection();
198
+
199
+ if (lexical.$isRangeSelection(selection)) {
200
+ const anchor = selection.anchor;
201
+ const anchorNode = anchor.getNode();
202
+ const prevSibling = anchorNode.getPreviousSibling();
203
+ return lexical.$isTextNode(prevSibling) && prevSibling.isTextEntity();
204
+ }
205
+
206
+ return false;
207
+ });
208
+ }
209
+
210
+ function startTransition(callback) {
211
+ if (React.startTransition) {
212
+ React.startTransition(callback);
213
+ } else {
214
+ callback();
215
+ }
216
+ }
217
+
218
+ function LexicalPopoverMenu({
219
+ close,
220
+ editor,
221
+ anchorElement,
222
+ resolution,
223
+ options,
224
+ menuRenderFn,
225
+ onSelectOption
226
+ }) {
227
+ const [selectedIndex, setHighlightedIndex] = React.useState(null);
228
+ React.useEffect(() => {
229
+ setHighlightedIndex(0);
230
+ }, [resolution.match.matchingString]);
231
+ const selectOptionAndCleanUp = React.useCallback(async selectedEntry => {
232
+ editor.update(() => {
233
+ const textNodeContainingQuery = splitNodeContainingQuery(editor, resolution.match);
234
+ onSelectOption(selectedEntry, textNodeContainingQuery, close, resolution.match.matchingString);
235
+ });
236
+ }, [close, editor, resolution.match, onSelectOption]);
237
+ const updateSelectedIndex = React.useCallback(index => {
238
+ const rootElem = editor.getRootElement();
239
+
240
+ if (rootElem !== null) {
241
+ rootElem.setAttribute('aria-activedescendant', 'typeahead-item-' + index);
242
+ setHighlightedIndex(index);
243
+ }
244
+ }, [editor]);
245
+ React.useEffect(() => {
246
+ return () => {
247
+ const rootElem = editor.getRootElement();
248
+
249
+ if (rootElem !== null) {
250
+ rootElem.removeAttribute('aria-activedescendant');
251
+ }
252
+ };
253
+ }, [editor]);
254
+ useLayoutEffect(() => {
255
+ if (options === null) {
256
+ setHighlightedIndex(null);
257
+ } else if (selectedIndex === null) {
258
+ updateSelectedIndex(0);
259
+ }
260
+ }, [options, selectedIndex, updateSelectedIndex]);
261
+ React.useEffect(() => {
262
+ return utils.mergeRegister(editor.registerCommand(lexical.KEY_ARROW_DOWN_COMMAND, payload => {
263
+ const event = payload;
264
+
265
+ if (options !== null && options.length && selectedIndex !== null) {
266
+ const newSelectedIndex = selectedIndex !== options.length - 1 ? selectedIndex + 1 : 0;
267
+ updateSelectedIndex(newSelectedIndex);
268
+ const option = options[newSelectedIndex];
269
+
270
+ if (option.ref != null && option.ref.current) {
271
+ scrollIntoViewIfNeeded(option.ref.current);
272
+ }
273
+
274
+ event.preventDefault();
275
+ event.stopImmediatePropagation();
276
+ }
277
+
278
+ return true;
279
+ }, lexical.COMMAND_PRIORITY_LOW), editor.registerCommand(lexical.KEY_ARROW_UP_COMMAND, payload => {
280
+ const event = payload;
281
+
282
+ if (options !== null && options.length && selectedIndex !== null) {
283
+ const newSelectedIndex = selectedIndex !== 0 ? selectedIndex - 1 : options.length - 1;
284
+ updateSelectedIndex(newSelectedIndex);
285
+ const option = options[newSelectedIndex];
286
+
287
+ if (option.ref != null && option.ref.current) {
288
+ scrollIntoViewIfNeeded(option.ref.current);
289
+ }
290
+
291
+ event.preventDefault();
292
+ event.stopImmediatePropagation();
293
+ }
294
+
295
+ return true;
296
+ }, lexical.COMMAND_PRIORITY_LOW), editor.registerCommand(lexical.KEY_ESCAPE_COMMAND, payload => {
297
+ const event = payload;
298
+ event.preventDefault();
299
+ event.stopImmediatePropagation();
300
+ close();
301
+ return true;
302
+ }, lexical.COMMAND_PRIORITY_LOW), editor.registerCommand(lexical.KEY_TAB_COMMAND, payload => {
303
+ const event = payload;
304
+
305
+ if (options === null || selectedIndex === null || options[selectedIndex] == null) {
306
+ return false;
307
+ }
308
+
309
+ event.preventDefault();
310
+ event.stopImmediatePropagation();
311
+ selectOptionAndCleanUp(options[selectedIndex]);
312
+ return true;
313
+ }, lexical.COMMAND_PRIORITY_LOW), editor.registerCommand(lexical.KEY_ENTER_COMMAND, event => {
314
+ if (options === null || selectedIndex === null || options[selectedIndex] == null) {
315
+ return false;
316
+ }
317
+
318
+ if (event !== null) {
319
+ event.preventDefault();
320
+ event.stopImmediatePropagation();
321
+ }
322
+
323
+ selectOptionAndCleanUp(options[selectedIndex]);
324
+ return true;
325
+ }, lexical.COMMAND_PRIORITY_LOW));
326
+ }, [selectOptionAndCleanUp, close, editor, options, selectedIndex, updateSelectedIndex]);
327
+ const listItemProps = React.useMemo(() => ({
328
+ selectOptionAndCleanUp,
329
+ selectedIndex,
330
+ setHighlightedIndex
331
+ }), [selectOptionAndCleanUp, selectedIndex]);
332
+ return menuRenderFn(anchorElement, listItemProps, resolution.match.matchingString);
333
+ }
334
+
335
+ function useBasicTypeaheadTriggerMatch(trigger, {
336
+ minLength = 1,
337
+ maxLength = 75
338
+ }) {
339
+ return React.useCallback(text => {
340
+ const validChars = '[^' + trigger + PUNCTUATION + '\\s]';
341
+ const TypeaheadTriggerRegex = new RegExp('(^|\\s|\\()(' + '[' + trigger + ']' + '((?:' + validChars + '){0,' + maxLength + '})' + ')$');
342
+ const match = TypeaheadTriggerRegex.exec(text);
343
+
344
+ if (match !== null) {
345
+ const maybeLeadingWhitespace = match[1];
346
+ const matchingString = match[3];
347
+
348
+ if (matchingString.length >= minLength) {
349
+ return {
350
+ leadOffset: match.index + maybeLeadingWhitespace.length,
351
+ matchingString,
352
+ replaceableString: match[2]
353
+ };
354
+ }
355
+ }
356
+
357
+ return null;
358
+ }, [maxLength, minLength, trigger]);
359
+ }
360
+
361
+ function useAnchorElementRef(resolution, options) {
362
+ const [editor] = LexicalComposerContext.useLexicalComposerContext();
363
+ const anchorElementRef = React.useRef(document.createElement('div'));
364
+ React.useEffect(() => {
365
+ const rootElement = editor.getRootElement();
366
+
367
+ function positionMenu() {
368
+ const containerDiv = anchorElementRef.current;
369
+ containerDiv.setAttribute('aria-label', 'Typeahead menu');
370
+ containerDiv.setAttribute('id', 'typeahead-menu');
371
+ containerDiv.setAttribute('role', 'listbox');
372
+
373
+ if (rootElement !== null && resolution !== null) {
374
+ const {
375
+ left,
376
+ top,
377
+ height,
378
+ width
379
+ } = resolution.getRect();
380
+ containerDiv.style.top = `${top + height + window.pageYOffset}px`;
381
+ containerDiv.style.left = `${left + width + window.pageXOffset}px`;
382
+ containerDiv.style.display = 'block';
383
+ containerDiv.style.position = 'absolute';
384
+
385
+ if (!containerDiv.isConnected) {
386
+ document.body.append(containerDiv);
387
+ }
388
+
389
+ anchorElementRef.current = containerDiv;
390
+ rootElement.setAttribute('aria-controls', 'typeahead-menu');
391
+ }
392
+ }
393
+
394
+ if (resolution !== null) {
395
+ positionMenu();
396
+ window.addEventListener('resize', positionMenu);
397
+ return () => {
398
+ window.removeEventListener('resize', positionMenu);
399
+
400
+ if (rootElement !== null) {
401
+ rootElement.removeAttribute('aria-controls');
402
+ }
403
+ };
404
+ }
405
+ }, [editor, resolution, options]);
406
+ return anchorElementRef;
407
+ }
408
+
409
+ function LexicalTypeaheadMenuPlugin({
410
+ options,
411
+ onQueryChange,
412
+ onSelectOption,
413
+ menuRenderFn,
414
+ triggerFn
415
+ }) {
416
+ const [editor] = LexicalComposerContext.useLexicalComposerContext();
417
+ const [resolution, setResolution] = React.useState(null);
418
+ const anchorElementRef = useAnchorElementRef(resolution, options);
419
+ React.useEffect(() => {
420
+ let activeRange = document.createRange();
421
+ let previousText = null;
422
+
423
+ const updateListener = () => {
424
+ editor.getEditorState().read(() => {
425
+ const range = activeRange;
426
+ const selection = lexical.$getSelection();
427
+ const text = getQueryTextForSearch(editor);
428
+
429
+ if (!lexical.$isRangeSelection(selection) || !selection.isCollapsed() || text === previousText || text === null || range === null) {
430
+ setResolution(null);
431
+ return;
432
+ }
433
+
434
+ previousText = text;
435
+ const match = triggerFn(text, editor);
436
+ onQueryChange(match ? match.matchingString : null);
437
+
438
+ if (match !== null && !isSelectionOnEntityBoundary(editor, match.leadOffset)) {
439
+ const isRangePositioned = tryToPositionRange(match.leadOffset, range);
440
+
441
+ if (isRangePositioned !== null) {
442
+ startTransition(() => setResolution({
443
+ getRect: () => range.getBoundingClientRect(),
444
+ match
445
+ }));
446
+ return;
447
+ }
448
+ }
449
+
450
+ setResolution(null);
451
+ });
452
+ };
453
+
454
+ const removeUpdateListener = editor.registerUpdateListener(updateListener);
455
+ return () => {
456
+ activeRange = null;
457
+ removeUpdateListener();
458
+ };
459
+ }, [editor, triggerFn, onQueryChange, resolution]);
460
+ const closeTypeahead = React.useCallback(() => {
461
+ setResolution(null);
462
+ }, []);
463
+ return resolution === null || editor === null ? null : /*#__PURE__*/React.createElement(LexicalPopoverMenu, {
464
+ close: closeTypeahead,
465
+ resolution: resolution,
466
+ editor: editor,
467
+ anchorElement: anchorElementRef.current,
468
+ options: options,
469
+ menuRenderFn: menuRenderFn,
470
+ onSelectOption: onSelectOption
471
+ });
472
+ }
473
+ function LexicalNodeMenuPlugin({
474
+ options,
475
+ nodeKey,
476
+ onClose,
477
+ onSelectOption,
478
+ menuRenderFn
479
+ }) {
480
+ const [editor] = LexicalComposerContext.useLexicalComposerContext();
481
+ const [resolution, setResolution] = React.useState(null);
482
+ const anchorElementRef = useAnchorElementRef(resolution, options);
483
+ React.useEffect(() => {
484
+ if (nodeKey && resolution == null) {
485
+ editor.update(() => {
486
+ const node = lexical.$getNodeByKey(nodeKey);
487
+ const domElement = editor.getElementByKey(nodeKey);
488
+
489
+ if (node != null && domElement != null) {
490
+ const text = node.getTextContent();
491
+ startTransition(() => setResolution({
492
+ getRect: () => domElement.getBoundingClientRect(),
493
+ match: {
494
+ leadOffset: text.length,
495
+ matchingString: text,
496
+ replaceableString: text
497
+ }
498
+ }));
499
+ }
500
+ });
501
+ } else if (nodeKey == null && resolution != null) {
502
+ setResolution(null);
503
+ }
504
+ }, [editor, nodeKey, resolution]);
505
+ return resolution === null || editor === null ? null : /*#__PURE__*/React.createElement(LexicalPopoverMenu, {
506
+ close: onClose,
507
+ resolution: resolution,
508
+ editor: editor,
509
+ anchorElement: anchorElementRef.current,
510
+ options: options,
511
+ menuRenderFn: menuRenderFn,
512
+ onSelectOption: onSelectOption
513
+ });
514
+ }
515
+
516
+ exports.LexicalNodeMenuPlugin = LexicalNodeMenuPlugin;
517
+ exports.LexicalTypeaheadMenuPlugin = LexicalTypeaheadMenuPlugin;
518
+ exports.PUNCTUATION = PUNCTUATION;
519
+ exports.TypeaheadOption = TypeaheadOption;
520
+ exports.useBasicTypeaheadTriggerMatch = useBasicTypeaheadTriggerMatch;
@@ -0,0 +1,9 @@
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 LexicalTypeaheadMenuPlugin = process.env.NODE_ENV === 'development' ? require('./LexicalTypeaheadMenuPlugin.dev.js') : require('./LexicalTypeaheadMenuPlugin.prod.js')
9
+ module.exports = LexicalTypeaheadMenuPlugin;
@@ -0,0 +1,22 @@
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 m=require("@lexical/react/LexicalComposerContext"),n=require("@lexical/utils"),w=require("lexical"),x=require("react"),y="undefined"!==typeof window&&"undefined"!==typeof window.document&&"undefined"!==typeof window.document.createElement?x.useLayoutEffect:x.useEffect;class z{constructor(b){this.key=b;this.ref={current:null};this.setRefElement=this.setRefElement.bind(this)}setRefElement(b){this.ref={current:b}}}
8
+ let A=b=>{var a=document.getElementById("typeahead-menu");if(a){a=a.getBoundingClientRect();const c=b.getBoundingClientRect();c.bottom>a.bottom?b.scrollIntoView(!1):c.top<a.top&&b.scrollIntoView()}};function C(b,a){var c=window.getSelection();if(null===c||!c.isCollapsed)return!1;let d=c.anchorNode;c=c.anchorOffset;if(null==d||null==c)return!1;try{a.setStart(d,b),a.setEnd(d,c)}catch(e){return!1}return!0}
9
+ function D(b){let a=null;b.getEditorState().read(()=>{var c=w.$getSelection();if(w.$isRangeSelection(c)){var d=c.anchor;"text"!==d.type?a=null:(c=d.getNode(),c.isSimpleText()?(d=d.offset,a=c.getTextContent().slice(0,d)):a=null)}});return a}
10
+ function E(b,a){b=w.$getSelection();if(!w.$isRangeSelection(b)||!b.isCollapsed())return null;var c=b.anchor;if("text"!==c.type)return null;b=c.getNode();if(!b.isSimpleText())return null;c=c.offset;let d=b.getTextContent().slice(0,c);var e=a.matchingString;a=a.replaceableString.length;for(let f=a;f<=e.length;f++)d.substr(-f)===e.substr(0,f)&&(a=f);a=c-a;if(0>a)return null;let g;0===a?[g]=b.splitText(c):[,g]=b.splitText(a,c);return g}
11
+ function F(b,a){return 0!==a?!1:b.getEditorState().read(()=>{var c=w.$getSelection();return w.$isRangeSelection(c)?(c=c.anchor.getNode().getPreviousSibling(),w.$isTextNode(c)&&c.isTextEntity()):!1})}function G(b){x.startTransition?x.startTransition(b):b()}
12
+ function H({close:b,editor:a,anchorElement:c,resolution:d,options:e,menuRenderFn:g,onSelectOption:f}){let [h,r]=x.useState(null);x.useEffect(()=>{r(0)},[d.match.matchingString]);let q=x.useCallback(async k=>{a.update(()=>{const l=E(a,d.match);f(k,l,b,d.match.matchingString)})},[b,a,d.match,f]),p=x.useCallback(k=>{const l=a.getRootElement();null!==l&&(l.setAttribute("aria-activedescendant","typeahead-item-"+k),r(k))},[a]);x.useEffect(()=>()=>{let k=a.getRootElement();null!==k&&k.removeAttribute("aria-activedescendant")},
13
+ [a]);y(()=>{null===e?r(null):null===h&&p(0)},[e,h,p]);x.useEffect(()=>n.mergeRegister(a.registerCommand(w.KEY_ARROW_DOWN_COMMAND,k=>{if(null!==e&&e.length&&null!==h){var l=h!==e.length-1?h+1:0;p(l);l=e[l];null!=l.ref&&l.ref.current&&A(l.ref.current);k.preventDefault();k.stopImmediatePropagation()}return!0},w.COMMAND_PRIORITY_LOW),a.registerCommand(w.KEY_ARROW_UP_COMMAND,k=>{if(null!==e&&e.length&&null!==h){var l=0!==h?h-1:e.length-1;p(l);l=e[l];null!=l.ref&&l.ref.current&&A(l.ref.current);k.preventDefault();
14
+ k.stopImmediatePropagation()}return!0},w.COMMAND_PRIORITY_LOW),a.registerCommand(w.KEY_ESCAPE_COMMAND,k=>{k.preventDefault();k.stopImmediatePropagation();b();return!0},w.COMMAND_PRIORITY_LOW),a.registerCommand(w.KEY_TAB_COMMAND,k=>{if(null===e||null===h||null==e[h])return!1;k.preventDefault();k.stopImmediatePropagation();q(e[h]);return!0},w.COMMAND_PRIORITY_LOW),a.registerCommand(w.KEY_ENTER_COMMAND,k=>{if(null===e||null===h||null==e[h])return!1;null!==k&&(k.preventDefault(),k.stopImmediatePropagation());
15
+ q(e[h]);return!0},w.COMMAND_PRIORITY_LOW)),[q,b,a,e,h,p]);let t=x.useMemo(()=>({selectOptionAndCleanUp:q,selectedIndex:h,setHighlightedIndex:r}),[q,h]);return g(c,t,d.match.matchingString)}
16
+ function I(b,a){let [c]=m.useLexicalComposerContext(),d=x.useRef(document.createElement("div"));x.useEffect(()=>{function e(){let f=d.current;f.setAttribute("aria-label","Typeahead menu");f.setAttribute("id","typeahead-menu");f.setAttribute("role","listbox");if(null!==g&&null!==b){let {left:h,top:r,height:q,width:p}=b.getRect();f.style.top=`${r+q+window.pageYOffset}px`;f.style.left=`${h+p+window.pageXOffset}px`;f.style.display="block";f.style.position="absolute";f.isConnected||document.body.append(f);
17
+ d.current=f;g.setAttribute("aria-controls","typeahead-menu")}}let g=c.getRootElement();if(null!==b)return e(),window.addEventListener("resize",e),()=>{window.removeEventListener("resize",e);null!==g&&g.removeAttribute("aria-controls")}},[c,b,a]);return d}
18
+ exports.LexicalNodeMenuPlugin=function({options:b,nodeKey:a,onClose:c,onSelectOption:d,menuRenderFn:e}){let [g]=m.useLexicalComposerContext(),[f,h]=x.useState(null),r=I(f,b);x.useEffect(()=>{a&&null==f?g.update(()=>{let q=w.$getNodeByKey(a),p=g.getElementByKey(a);if(null!=q&&null!=p){let t=q.getTextContent();G(()=>h({getRect:()=>p.getBoundingClientRect(),match:{leadOffset:t.length,matchingString:t,replaceableString:t}}))}}):null==a&&null!=f&&h(null)},[g,a,f]);return null===f||null===g?null:x.createElement(H,
19
+ {close:c,resolution:f,editor:g,anchorElement:r.current,options:b,menuRenderFn:e,onSelectOption:d})};
20
+ exports.LexicalTypeaheadMenuPlugin=function({options:b,onQueryChange:a,onSelectOption:c,menuRenderFn:d,triggerFn:e}){let [g]=m.useLexicalComposerContext(),[f,h]=x.useState(null),r=I(f,b);x.useEffect(()=>{let p=document.createRange(),t=null,k=g.registerUpdateListener(()=>{g.getEditorState().read(()=>{const l=p,B=w.$getSelection(),v=D(g);if(w.$isRangeSelection(B)&&B.isCollapsed()&&v!==t&&null!==v&&null!==l){t=v;var u=e(v,g);a(u?u.matchingString:null);null===u||F(g,u.leadOffset)||null===C(u.leadOffset,
21
+ l)?h(null):G(()=>h({getRect:()=>l.getBoundingClientRect(),match:u}))}else h(null)})});return()=>{p=null;k()}},[g,e,a,f]);let q=x.useCallback(()=>{h(null)},[]);return null===f||null===g?null:x.createElement(H,{close:q,resolution:f,editor:g,anchorElement:r.current,options:b,menuRenderFn:d,onSelectOption:c})};exports.PUNCTUATION="\\.,\\+\\*\\?\\$\\@\\|#{}\\(\\)\\^\\-\\[\\]\\\\/!%'\"~=<>_:;";exports.TypeaheadOption=z;
22
+ exports.useBasicTypeaheadTriggerMatch=function(b,{minLength:a=1,maxLength:c=75}){return x.useCallback(d=>{d=(new RegExp("(^|\\s|\\()(["+b+"]((?:[^"+(b+"\\.,\\+\\*\\?\\$\\@\\|#{}\\(\\)\\^\\-\\[\\]\\\\/!%'\"~=<>_:;\\s]){0,")+c+"}))$")).exec(d);if(null!==d){let e=d[1],g=d[3];if(g.length>=a)return{leadOffset:d.index+e.length,matchingString:g,replaceableString:d[2]}}return null},[c,a,b])}
package/package.json CHANGED
@@ -8,28 +8,28 @@
8
8
  "rich-text"
9
9
  ],
10
10
  "license": "MIT",
11
- "version": "0.3.7",
11
+ "version": "0.3.10",
12
12
  "dependencies": {
13
- "@lexical/clipboard": "0.3.7",
14
- "@lexical/code": "0.3.7",
15
- "@lexical/dragon": "0.3.7",
16
- "@lexical/hashtag": "0.3.7",
17
- "@lexical/history": "0.3.7",
18
- "@lexical/link": "0.3.7",
19
- "@lexical/list": "0.3.7",
20
- "@lexical/mark": "0.3.7",
21
- "@lexical/markdown": "0.3.7",
22
- "@lexical/overflow": "0.3.7",
23
- "@lexical/plain-text": "0.3.7",
24
- "@lexical/rich-text": "0.3.7",
25
- "@lexical/selection": "0.3.7",
26
- "@lexical/table": "0.3.7",
27
- "@lexical/text": "0.3.7",
28
- "@lexical/utils": "0.3.7",
29
- "@lexical/yjs": "0.3.7"
13
+ "@lexical/clipboard": "0.3.10",
14
+ "@lexical/code": "0.3.10",
15
+ "@lexical/dragon": "0.3.10",
16
+ "@lexical/hashtag": "0.3.10",
17
+ "@lexical/history": "0.3.10",
18
+ "@lexical/link": "0.3.10",
19
+ "@lexical/list": "0.3.10",
20
+ "@lexical/mark": "0.3.10",
21
+ "@lexical/markdown": "0.3.10",
22
+ "@lexical/overflow": "0.3.10",
23
+ "@lexical/plain-text": "0.3.10",
24
+ "@lexical/rich-text": "0.3.10",
25
+ "@lexical/selection": "0.3.10",
26
+ "@lexical/table": "0.3.10",
27
+ "@lexical/text": "0.3.10",
28
+ "@lexical/utils": "0.3.10",
29
+ "@lexical/yjs": "0.3.10"
30
30
  },
31
31
  "peerDependencies": {
32
- "lexical": "0.3.7",
32
+ "lexical": "0.3.10",
33
33
  "react": ">=17.x",
34
34
  "react-dom": ">=17.x"
35
35
  },