@depup/lexical__react 0.41.0-depup.0 → 0.43.0-depup.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.
Files changed (108) hide show
  1. package/LexicalAutoEmbedPlugin.d.ts +2 -2
  2. package/LexicalAutoEmbedPlugin.js.flow +4 -4
  3. package/LexicalAutoFocusPlugin.js.flow +1 -1
  4. package/LexicalBlockWithAlignableContents.js.flow +2 -2
  5. package/LexicalClearEditorPlugin.js.flow +1 -1
  6. package/LexicalComposer.js.flow +2 -2
  7. package/LexicalContentEditable.js.flow +6 -6
  8. package/LexicalDecoratorBlockNode.d.ts +2 -0
  9. package/LexicalDecoratorBlockNode.dev.js +7 -0
  10. package/LexicalDecoratorBlockNode.dev.mjs +7 -0
  11. package/LexicalDecoratorBlockNode.prod.js +1 -1
  12. package/LexicalDecoratorBlockNode.prod.mjs +1 -1
  13. package/LexicalDraggableBlockPlugin.dev.js +2 -4
  14. package/LexicalDraggableBlockPlugin.dev.mjs +2 -4
  15. package/LexicalDraggableBlockPlugin.js.flow +1 -1
  16. package/LexicalDraggableBlockPlugin.prod.js +1 -1
  17. package/LexicalDraggableBlockPlugin.prod.mjs +1 -1
  18. package/LexicalEditorRefPlugin.d.ts +1 -1
  19. package/LexicalEditorRefPlugin.dev.js +0 -1
  20. package/LexicalEditorRefPlugin.dev.mjs +0 -1
  21. package/LexicalEditorRefPlugin.js.flow +1 -1
  22. package/LexicalErrorBoundary.js.flow +1 -1
  23. package/LexicalExtensionComposer.d.ts +1 -1
  24. package/LexicalExtensionEditorComposer.d.ts +20 -0
  25. package/LexicalExtensionEditorComposer.dev.js +55 -0
  26. package/LexicalExtensionEditorComposer.dev.mjs +53 -0
  27. package/LexicalExtensionEditorComposer.js +11 -0
  28. package/LexicalExtensionEditorComposer.js.flow +27 -0
  29. package/{LexicalContextMenuPlugin.mjs → LexicalExtensionEditorComposer.mjs} +3 -4
  30. package/{LexicalContextMenuPlugin.node.mjs → LexicalExtensionEditorComposer.node.mjs} +2 -3
  31. package/LexicalExtensionEditorComposer.prod.js +9 -0
  32. package/LexicalExtensionEditorComposer.prod.mjs +9 -0
  33. package/LexicalHorizontalRulePlugin.d.ts +3 -0
  34. package/LexicalHorizontalRulePlugin.dev.js +4 -0
  35. package/LexicalHorizontalRulePlugin.dev.mjs +4 -0
  36. package/LexicalHorizontalRulePlugin.js.flow +1 -1
  37. package/LexicalLinkPlugin.js.flow +1 -1
  38. package/LexicalMarkdownShortcutPlugin.dev.js +4 -4
  39. package/LexicalMarkdownShortcutPlugin.dev.mjs +1 -1
  40. package/LexicalMarkdownShortcutPlugin.prod.js +1 -1
  41. package/LexicalMarkdownShortcutPlugin.prod.mjs +1 -1
  42. package/LexicalNestedComposer.js.flow +1 -1
  43. package/LexicalNodeContextMenuPlugin.dev.js +2 -4
  44. package/LexicalNodeContextMenuPlugin.dev.mjs +2 -4
  45. package/LexicalNodeContextMenuPlugin.prod.js +1 -1
  46. package/LexicalNodeContextMenuPlugin.prod.mjs +1 -1
  47. package/LexicalNodeEventPlugin.dev.js +2 -4
  48. package/LexicalNodeEventPlugin.dev.mjs +2 -4
  49. package/LexicalNodeEventPlugin.prod.js +1 -1
  50. package/LexicalNodeEventPlugin.prod.mjs +1 -1
  51. package/LexicalNodeMenuPlugin.d.ts +1 -1
  52. package/LexicalNodeMenuPlugin.dev.js +53 -2
  53. package/LexicalNodeMenuPlugin.dev.mjs +54 -3
  54. package/LexicalNodeMenuPlugin.js.flow +3 -2
  55. package/LexicalNodeMenuPlugin.prod.js +1 -1
  56. package/LexicalNodeMenuPlugin.prod.mjs +1 -1
  57. package/LexicalPlainTextPlugin.dev.js +0 -3
  58. package/LexicalPlainTextPlugin.dev.mjs +0 -3
  59. package/LexicalReactExtension.dev.js +1 -3
  60. package/LexicalReactExtension.dev.mjs +1 -3
  61. package/LexicalReactExtension.js.flow +1 -1
  62. package/LexicalReactPluginHostExtension.dev.mjs +1 -1
  63. package/LexicalReactPluginHostExtension.js.flow +3 -3
  64. package/LexicalReactPluginHostExtension.prod.mjs +1 -1
  65. package/LexicalRichTextPlugin.dev.js +0 -3
  66. package/LexicalRichTextPlugin.dev.mjs +0 -3
  67. package/LexicalSelectionAlwaysOnDisplay.d.ts +1 -1
  68. package/LexicalTabIndentationPlugin.js.flow +1 -1
  69. package/LexicalTablePlugin.d.ts +1 -7
  70. package/LexicalTablePlugin.dev.js +2 -5
  71. package/LexicalTablePlugin.dev.mjs +2 -5
  72. package/LexicalTablePlugin.js.flow +1 -1
  73. package/LexicalTablePlugin.prod.js +1 -1
  74. package/LexicalTablePlugin.prod.mjs +1 -1
  75. package/LexicalTypeaheadMenuPlugin.d.ts +1 -1
  76. package/LexicalTypeaheadMenuPlugin.dev.js +53 -2
  77. package/LexicalTypeaheadMenuPlugin.dev.mjs +54 -3
  78. package/LexicalTypeaheadMenuPlugin.js.flow +8 -7
  79. package/LexicalTypeaheadMenuPlugin.prod.js +1 -1
  80. package/LexicalTypeaheadMenuPlugin.prod.mjs +1 -1
  81. package/README.md +2 -2
  82. package/changes.json +1 -1
  83. package/package.json +80 -50
  84. package/shared/LexicalMenu.d.ts +5 -4
  85. package/useExtensionComponent.d.ts +2 -0
  86. package/useExtensionSignalValue.d.ts +61 -0
  87. package/useLexicalExtensionComponent.dev.js +8 -0
  88. package/useLexicalExtensionComponent.dev.mjs +8 -2
  89. package/useLexicalExtensionComponent.mjs +3 -1
  90. package/useLexicalExtensionComponent.node.mjs +3 -1
  91. package/useLexicalExtensionComponent.prod.js +1 -1
  92. package/useLexicalExtensionComponent.prod.mjs +1 -1
  93. package/useLexicalExtensionSignalValue.dev.js +84 -0
  94. package/useLexicalExtensionSignalValue.dev.mjs +81 -0
  95. package/useLexicalExtensionSignalValue.js +11 -0
  96. package/useLexicalExtensionSignalValue.js.flow +18 -0
  97. package/useLexicalExtensionSignalValue.mjs +13 -0
  98. package/useLexicalExtensionSignalValue.node.mjs +11 -0
  99. package/useLexicalExtensionSignalValue.prod.js +9 -0
  100. package/useLexicalExtensionSignalValue.prod.mjs +9 -0
  101. package/useLexicalTextEntity.js.flow +1 -1
  102. package/LexicalContextMenuPlugin.d.ts +0 -42
  103. package/LexicalContextMenuPlugin.dev.js +0 -526
  104. package/LexicalContextMenuPlugin.dev.mjs +0 -511
  105. package/LexicalContextMenuPlugin.js +0 -11
  106. package/LexicalContextMenuPlugin.js.flow +0 -13
  107. package/LexicalContextMenuPlugin.prod.js +0 -9
  108. package/LexicalContextMenuPlugin.prod.mjs +0 -9
package/package.json CHANGED
@@ -14,26 +14,26 @@
14
14
  "rich-text"
15
15
  ],
16
16
  "license": "MIT",
17
- "version": "0.41.0-depup.0",
17
+ "version": "0.43.0-depup.0",
18
18
  "dependencies": {
19
19
  "@floating-ui/react": "^0.27.19",
20
- "@lexical/devtools-core": "0.41.0",
21
- "@lexical/dragon": "0.41.0",
22
- "@lexical/extension": "0.41.0",
23
- "@lexical/hashtag": "0.41.0",
24
- "@lexical/history": "0.41.0",
25
- "@lexical/link": "0.41.0",
26
- "@lexical/list": "0.41.0",
27
- "@lexical/mark": "0.41.0",
28
- "@lexical/markdown": "0.41.0",
29
- "@lexical/overflow": "0.41.0",
30
- "@lexical/plain-text": "0.41.0",
31
- "@lexical/rich-text": "0.41.0",
32
- "@lexical/table": "0.41.0",
33
- "@lexical/text": "0.41.0",
34
- "@lexical/utils": "0.41.0",
35
- "@lexical/yjs": "0.41.0",
36
- "lexical": "0.41.0",
20
+ "@lexical/devtools-core": "0.43.0",
21
+ "@lexical/dragon": "0.43.0",
22
+ "@lexical/extension": "0.43.0",
23
+ "@lexical/hashtag": "0.43.0",
24
+ "@lexical/history": "0.43.0",
25
+ "@lexical/link": "0.43.0",
26
+ "@lexical/list": "0.43.0",
27
+ "@lexical/mark": "0.43.0",
28
+ "@lexical/markdown": "0.43.0",
29
+ "@lexical/overflow": "0.43.0",
30
+ "@lexical/plain-text": "0.43.0",
31
+ "@lexical/rich-text": "0.43.0",
32
+ "@lexical/table": "0.43.0",
33
+ "@lexical/text": "0.43.0",
34
+ "@lexical/utils": "0.43.0",
35
+ "@lexical/yjs": "0.43.0",
36
+ "lexical": "0.43.0",
37
37
  "react-error-boundary": "^6.1.1"
38
38
  },
39
39
  "peerDependencies": {
@@ -466,36 +466,6 @@
466
466
  "default": "./LexicalContentEditable.js"
467
467
  }
468
468
  },
469
- "./LexicalContextMenuPlugin": {
470
- "import": {
471
- "types": "./LexicalContextMenuPlugin.d.ts",
472
- "development": "./LexicalContextMenuPlugin.dev.mjs",
473
- "production": "./LexicalContextMenuPlugin.prod.mjs",
474
- "node": "./LexicalContextMenuPlugin.node.mjs",
475
- "default": "./LexicalContextMenuPlugin.mjs"
476
- },
477
- "require": {
478
- "types": "./LexicalContextMenuPlugin.d.ts",
479
- "development": "./LexicalContextMenuPlugin.dev.js",
480
- "production": "./LexicalContextMenuPlugin.prod.js",
481
- "default": "./LexicalContextMenuPlugin.js"
482
- }
483
- },
484
- "./LexicalContextMenuPlugin.js": {
485
- "import": {
486
- "types": "./LexicalContextMenuPlugin.d.ts",
487
- "development": "./LexicalContextMenuPlugin.dev.mjs",
488
- "production": "./LexicalContextMenuPlugin.prod.mjs",
489
- "node": "./LexicalContextMenuPlugin.node.mjs",
490
- "default": "./LexicalContextMenuPlugin.mjs"
491
- },
492
- "require": {
493
- "types": "./LexicalContextMenuPlugin.d.ts",
494
- "development": "./LexicalContextMenuPlugin.dev.js",
495
- "production": "./LexicalContextMenuPlugin.prod.js",
496
- "default": "./LexicalContextMenuPlugin.js"
497
- }
498
- },
499
469
  "./LexicalDecoratorBlockNode": {
500
470
  "import": {
501
471
  "types": "./LexicalDecoratorBlockNode.d.ts",
@@ -646,6 +616,36 @@
646
616
  "default": "./LexicalExtensionComposer.js"
647
617
  }
648
618
  },
619
+ "./LexicalExtensionEditorComposer": {
620
+ "import": {
621
+ "types": "./LexicalExtensionEditorComposer.d.ts",
622
+ "development": "./LexicalExtensionEditorComposer.dev.mjs",
623
+ "production": "./LexicalExtensionEditorComposer.prod.mjs",
624
+ "node": "./LexicalExtensionEditorComposer.node.mjs",
625
+ "default": "./LexicalExtensionEditorComposer.mjs"
626
+ },
627
+ "require": {
628
+ "types": "./LexicalExtensionEditorComposer.d.ts",
629
+ "development": "./LexicalExtensionEditorComposer.dev.js",
630
+ "production": "./LexicalExtensionEditorComposer.prod.js",
631
+ "default": "./LexicalExtensionEditorComposer.js"
632
+ }
633
+ },
634
+ "./LexicalExtensionEditorComposer.js": {
635
+ "import": {
636
+ "types": "./LexicalExtensionEditorComposer.d.ts",
637
+ "development": "./LexicalExtensionEditorComposer.dev.mjs",
638
+ "production": "./LexicalExtensionEditorComposer.prod.mjs",
639
+ "node": "./LexicalExtensionEditorComposer.node.mjs",
640
+ "default": "./LexicalExtensionEditorComposer.mjs"
641
+ },
642
+ "require": {
643
+ "types": "./LexicalExtensionEditorComposer.d.ts",
644
+ "development": "./LexicalExtensionEditorComposer.dev.js",
645
+ "production": "./LexicalExtensionEditorComposer.prod.js",
646
+ "default": "./LexicalExtensionEditorComposer.js"
647
+ }
648
+ },
649
649
  "./LexicalHashtagPlugin": {
650
650
  "import": {
651
651
  "types": "./LexicalHashtagPlugin.d.ts",
@@ -1396,6 +1396,36 @@
1396
1396
  "default": "./useLexicalExtensionComponent.js"
1397
1397
  }
1398
1398
  },
1399
+ "./useExtensionSignalValue": {
1400
+ "import": {
1401
+ "types": "./useExtensionSignalValue.d.ts",
1402
+ "development": "./useLexicalExtensionSignalValue.dev.mjs",
1403
+ "production": "./useLexicalExtensionSignalValue.prod.mjs",
1404
+ "node": "./useLexicalExtensionSignalValue.node.mjs",
1405
+ "default": "./useLexicalExtensionSignalValue.mjs"
1406
+ },
1407
+ "require": {
1408
+ "types": "./useExtensionSignalValue.d.ts",
1409
+ "development": "./useLexicalExtensionSignalValue.dev.js",
1410
+ "production": "./useLexicalExtensionSignalValue.prod.js",
1411
+ "default": "./useLexicalExtensionSignalValue.js"
1412
+ }
1413
+ },
1414
+ "./useExtensionSignalValue.js": {
1415
+ "import": {
1416
+ "types": "./useExtensionSignalValue.d.ts",
1417
+ "development": "./useLexicalExtensionSignalValue.dev.mjs",
1418
+ "production": "./useLexicalExtensionSignalValue.prod.mjs",
1419
+ "node": "./useLexicalExtensionSignalValue.node.mjs",
1420
+ "default": "./useLexicalExtensionSignalValue.mjs"
1421
+ },
1422
+ "require": {
1423
+ "types": "./useExtensionSignalValue.d.ts",
1424
+ "development": "./useLexicalExtensionSignalValue.dev.js",
1425
+ "production": "./useLexicalExtensionSignalValue.prod.js",
1426
+ "default": "./useLexicalExtensionSignalValue.js"
1427
+ }
1428
+ },
1399
1429
  "./useLexicalEditable": {
1400
1430
  "import": {
1401
1431
  "types": "./useLexicalEditable.d.ts",
@@ -1565,8 +1595,8 @@
1565
1595
  },
1566
1596
  "depsUpdated": 2,
1567
1597
  "originalPackage": "@lexical/react",
1568
- "originalVersion": "0.41.0",
1569
- "processedAt": "2026-03-18T22:41:06.222Z",
1598
+ "originalVersion": "0.43.0",
1599
+ "processedAt": "2026-04-09T20:22:39.300Z",
1570
1600
  "smokeTest": "failed"
1571
1601
  }
1572
1602
  }
@@ -17,10 +17,11 @@ export type MenuResolution = {
17
17
  match?: MenuTextMatch;
18
18
  getRect: () => DOMRect;
19
19
  };
20
- export declare const PUNCTUATION = "\\.,\\+\\*\\?\\$\\@\\|#{}\\(\\)\\^\\-\\[\\]\\\\/!%'\"~=<>_:;";
21
20
  export declare class MenuOption {
22
21
  key: string;
23
22
  ref?: RefObject<HTMLElement | null>;
23
+ icon?: JSX.Element;
24
+ title?: JSX.Element | string;
24
25
  constructor(key: string);
25
26
  setRefElement(element: HTMLElement | null): void;
26
27
  }
@@ -29,21 +30,21 @@ export type MenuRenderFn<TOption extends MenuOption> = (anchorElementRef: RefObj
29
30
  selectOptionAndCleanUp: (option: TOption) => void;
30
31
  setHighlightedIndex: (index: number) => void;
31
32
  options: Array<TOption>;
32
- }, matchingString: string | null) => ReactPortal | JSX.Element | null;
33
+ }, matchingString: string) => ReactPortal | JSX.Element | null;
33
34
  export declare function getScrollParent(element: HTMLElement, includeHidden: boolean): HTMLElement | HTMLBodyElement;
34
35
  export declare function useDynamicPositioning(resolution: MenuResolution | null, targetElement: HTMLElement | null, onReposition: () => void, onVisibilityChange?: (isInView: boolean) => void): void;
35
36
  export declare const SCROLL_TYPEAHEAD_OPTION_INTO_VIEW_COMMAND: LexicalCommand<{
36
37
  index: number;
37
38
  option: MenuOption;
38
39
  }>;
39
- export declare function LexicalMenu<TOption extends MenuOption>({ close, editor, anchorElementRef, resolution, options, menuRenderFn, onSelectOption, shouldSplitNodeWithQuery, commandPriority, preselectFirstItem, }: {
40
+ export declare function LexicalMenu<TOption extends MenuOption>({ close, editor, anchorElementRef, resolution, options, menuRenderFn: menuRenderFnProp, onSelectOption, shouldSplitNodeWithQuery, commandPriority, preselectFirstItem, }: {
40
41
  close: () => void;
41
42
  editor: LexicalEditor;
42
43
  anchorElementRef: RefObject<HTMLElement | null>;
43
44
  resolution: MenuResolution;
44
45
  options: Array<TOption>;
45
46
  shouldSplitNodeWithQuery?: boolean;
46
- menuRenderFn: MenuRenderFn<TOption>;
47
+ menuRenderFn?: MenuRenderFn<TOption>;
47
48
  onSelectOption: (option: TOption, textNodeContainingQuery: TextNode | null, closeMenu: () => void, matchingString: string) => void;
48
49
  commandPriority?: CommandListenerPriority;
49
50
  preselectFirstItem?: boolean;
@@ -1,5 +1,7 @@
1
1
  import { type AnyLexicalExtension, type LexicalExtensionDependency, type OutputComponentExtension } from 'lexical';
2
2
  export declare function useExtensionDependency<Extension extends AnyLexicalExtension>(extension: Extension): LexicalExtensionDependency<Extension>;
3
+ export declare function useOptionalExtensionDependency<Extension extends AnyLexicalExtension>(extension: Extension): undefined | LexicalExtensionDependency<Extension>;
4
+ export declare function usePeerExtensionDependency<Extension extends AnyLexicalExtension>(extensionName: Extension['name']): undefined | LexicalExtensionDependency<Extension>;
3
5
  /**
4
6
  * Use a Component from the given Extension that uses the ReactExtension convention
5
7
  * of exposing a Component property in its output.
@@ -0,0 +1,61 @@
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
+ */
8
+ import type { ReadonlySignal } from '@lexical/extension';
9
+ import type { AnyLexicalExtension, LexicalExtensionOutput } from 'lexical';
10
+ /**
11
+ * A React hook that subscribes to a signal and returns its current value.
12
+ * The component will re-render whenever the signal's value changes.
13
+ *
14
+ * @param s - The ReadonlySignal to subscribe to
15
+ * @returns The current value of the signal
16
+ *
17
+ * @example
18
+ * ```tsx
19
+ * const signal = new Signal(0);
20
+ * function MyComponent() {
21
+ * const value = useSignalValue(signal);
22
+ * return <div>Value: {value}</div>;
23
+ * }
24
+ * ```
25
+ */
26
+ export declare function useSignalValue<V>(s: ReadonlySignal<V>): V;
27
+ /**
28
+ * Type helper that extracts the value type from a ReadonlySignal.
29
+ * If the type is not a ReadonlySignal, it returns never.
30
+ *
31
+ * @example
32
+ * ```tsx
33
+ * type MySignal = ReadonlySignal<number>;
34
+ * type Value = SignalValue<MySignal>; // number
35
+ * ```
36
+ */
37
+ export type SignalValue<S> = S extends ReadonlySignal<infer V> ? V : never;
38
+ /**
39
+ * A React hook that subscribes to a signal property from a Lexical extension's output
40
+ * and returns its current value. The component will re-render whenever the signal's value changes.
41
+ *
42
+ * This hook combines the functionality of useExtensionDependency and useSignalValue,
43
+ * providing a convenient way to access reactive values from Lexical extensions.
44
+ *
45
+ * @param extension - The Lexical extension instance
46
+ * @param prop - The property name in the extension's output that contains a signal
47
+ * @returns The current value of the signal property
48
+ *
49
+ * @example
50
+ * ```tsx
51
+ * import {useExtensionSignalValue} from '@lexical/react/useExtensionSignalValue';
52
+ * import {MyExtension} from './MyExtension';
53
+ *
54
+ * function MyComponent() {
55
+ * // Assuming MyExtension has a signal property 'count' in its output
56
+ * const count = useExtensionSignalValue(MyExtension, 'count');
57
+ * return <div>Count: {count}</div>;
58
+ * }
59
+ * ```
60
+ */
61
+ export declare function useExtensionSignalValue<Extension extends AnyLexicalExtension, K extends keyof LexicalExtensionOutput<Extension>>(extension: Extension, prop: K): SignalValue<LexicalExtensionOutput<Extension>[K]>;
@@ -21,6 +21,12 @@ var LexicalComposerContext = require('@lexical/react/LexicalComposerContext');
21
21
  function useExtensionDependency(extension$1) {
22
22
  return extension.getExtensionDependencyFromEditor(LexicalComposerContext.useLexicalComposerContext()[0], extension$1);
23
23
  }
24
+ function useOptionalExtensionDependency(extension) {
25
+ return usePeerExtensionDependency(extension.name);
26
+ }
27
+ function usePeerExtensionDependency(extensionName) {
28
+ return extension.getPeerDependencyFromEditor(LexicalComposerContext.useLexicalComposerContext()[0], extensionName);
29
+ }
24
30
 
25
31
  /**
26
32
  * Use a Component from the given Extension that uses the ReactExtension convention
@@ -35,3 +41,5 @@ function useExtensionComponent(extension) {
35
41
 
36
42
  exports.useExtensionComponent = useExtensionComponent;
37
43
  exports.useExtensionDependency = useExtensionDependency;
44
+ exports.useOptionalExtensionDependency = useOptionalExtensionDependency;
45
+ exports.usePeerExtensionDependency = usePeerExtensionDependency;
@@ -6,7 +6,7 @@
6
6
  *
7
7
  */
8
8
 
9
- import { getExtensionDependencyFromEditor } from '@lexical/extension';
9
+ import { getExtensionDependencyFromEditor, getPeerDependencyFromEditor } from '@lexical/extension';
10
10
  import { useLexicalComposerContext } from '@lexical/react/LexicalComposerContext';
11
11
 
12
12
  /**
@@ -19,6 +19,12 @@ import { useLexicalComposerContext } from '@lexical/react/LexicalComposerContext
19
19
  function useExtensionDependency(extension) {
20
20
  return getExtensionDependencyFromEditor(useLexicalComposerContext()[0], extension);
21
21
  }
22
+ function useOptionalExtensionDependency(extension) {
23
+ return usePeerExtensionDependency(extension.name);
24
+ }
25
+ function usePeerExtensionDependency(extensionName) {
26
+ return getPeerDependencyFromEditor(useLexicalComposerContext()[0], extensionName);
27
+ }
22
28
 
23
29
  /**
24
30
  * Use a Component from the given Extension that uses the ReactExtension convention
@@ -31,4 +37,4 @@ function useExtensionComponent(extension) {
31
37
  return useExtensionDependency(extension).output.Component;
32
38
  }
33
39
 
34
- export { useExtensionComponent, useExtensionDependency };
40
+ export { useExtensionComponent, useExtensionDependency, useOptionalExtensionDependency, usePeerExtensionDependency };
@@ -10,4 +10,6 @@ import * as modDev from './useLexicalExtensionComponent.dev.mjs';
10
10
  import * as modProd from './useLexicalExtensionComponent.prod.mjs';
11
11
  const mod = process.env.NODE_ENV !== 'production' ? modDev : modProd;
12
12
  export const useExtensionComponent = mod.useExtensionComponent;
13
- export const useExtensionDependency = mod.useExtensionDependency;
13
+ export const useExtensionDependency = mod.useExtensionDependency;
14
+ export const useOptionalExtensionDependency = mod.useOptionalExtensionDependency;
15
+ export const usePeerExtensionDependency = mod.usePeerExtensionDependency;
@@ -8,4 +8,6 @@
8
8
 
9
9
  const mod = await (process.env.NODE_ENV !== 'production' ? import('./useLexicalExtensionComponent.dev.mjs') : import('./useLexicalExtensionComponent.prod.mjs'));
10
10
  export const useExtensionComponent = mod.useExtensionComponent;
11
- export const useExtensionDependency = mod.useExtensionDependency;
11
+ export const useExtensionDependency = mod.useExtensionDependency;
12
+ export const useOptionalExtensionDependency = mod.useOptionalExtensionDependency;
13
+ export const usePeerExtensionDependency = mod.usePeerExtensionDependency;
@@ -6,4 +6,4 @@
6
6
  *
7
7
  */
8
8
 
9
- "use strict";var e=require("@lexical/extension"),n=require("@lexical/react/LexicalComposerContext");function t(t){return e.getExtensionDependencyFromEditor(n.useLexicalComposerContext()[0],t)}exports.useExtensionComponent=function(e){return t(e).output.Component},exports.useExtensionDependency=t;
9
+ "use strict";var e=require("@lexical/extension"),n=require("@lexical/react/LexicalComposerContext");function t(t){return e.getExtensionDependencyFromEditor(n.useLexicalComposerContext()[0],t)}function o(t){return e.getPeerDependencyFromEditor(n.useLexicalComposerContext()[0],t)}exports.useExtensionComponent=function(e){return t(e).output.Component},exports.useExtensionDependency=t,exports.useOptionalExtensionDependency=function(e){return o(e.name)},exports.usePeerExtensionDependency=o;
@@ -6,4 +6,4 @@
6
6
  *
7
7
  */
8
8
 
9
- import{getExtensionDependencyFromEditor as o}from"@lexical/extension";import{useLexicalComposerContext as t}from"@lexical/react/LexicalComposerContext";function e(e){return o(t()[0],e)}function n(o){return e(o).output.Component}export{n as useExtensionComponent,e as useExtensionDependency};
9
+ import{getExtensionDependencyFromEditor as n,getPeerDependencyFromEditor as t}from"@lexical/extension";import{useLexicalComposerContext as o}from"@lexical/react/LexicalComposerContext";function e(t){return n(o()[0],t)}function r(n){return i(n.name)}function i(n){return t(o()[0],n)}function u(n){return e(n).output.Component}export{u as useExtensionComponent,e as useExtensionDependency,r as useOptionalExtensionDependency,i as usePeerExtensionDependency};
@@ -0,0 +1,84 @@
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
+ */
8
+
9
+ 'use strict';
10
+
11
+ var useExtensionComponent = require('@lexical/react/useExtensionComponent');
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
+
22
+
23
+ /**
24
+ * A React hook that subscribes to a signal and returns its current value.
25
+ * The component will re-render whenever the signal's value changes.
26
+ *
27
+ * @param s - The ReadonlySignal to subscribe to
28
+ * @returns The current value of the signal
29
+ *
30
+ * @example
31
+ * ```tsx
32
+ * const signal = new Signal(0);
33
+ * function MyComponent() {
34
+ * const value = useSignalValue(signal);
35
+ * return <div>Value: {value}</div>;
36
+ * }
37
+ * ```
38
+ */
39
+ function useSignalValue(s) {
40
+ const [subscribe, getSnapshot] = react.useMemo(() => [s.subscribe.bind(s), s.peek.bind(s)], [s]);
41
+ return react.useSyncExternalStore(subscribe, getSnapshot, getSnapshot);
42
+ }
43
+
44
+ /**
45
+ * Type helper that extracts the value type from a ReadonlySignal.
46
+ * If the type is not a ReadonlySignal, it returns never.
47
+ *
48
+ * @example
49
+ * ```tsx
50
+ * type MySignal = ReadonlySignal<number>;
51
+ * type Value = SignalValue<MySignal>; // number
52
+ * ```
53
+ */
54
+
55
+ /**
56
+ * A React hook that subscribes to a signal property from a Lexical extension's output
57
+ * and returns its current value. The component will re-render whenever the signal's value changes.
58
+ *
59
+ * This hook combines the functionality of useExtensionDependency and useSignalValue,
60
+ * providing a convenient way to access reactive values from Lexical extensions.
61
+ *
62
+ * @param extension - The Lexical extension instance
63
+ * @param prop - The property name in the extension's output that contains a signal
64
+ * @returns The current value of the signal property
65
+ *
66
+ * @example
67
+ * ```tsx
68
+ * import {useExtensionSignalValue} from '@lexical/react/useExtensionSignalValue';
69
+ * import {MyExtension} from './MyExtension';
70
+ *
71
+ * function MyComponent() {
72
+ * // Assuming MyExtension has a signal property 'count' in its output
73
+ * const count = useExtensionSignalValue(MyExtension, 'count');
74
+ * return <div>Count: {count}</div>;
75
+ * }
76
+ * ```
77
+ */
78
+ function useExtensionSignalValue(extension, prop) {
79
+ const signal = useExtensionComponent.useExtensionDependency(extension).output[prop];
80
+ return useSignalValue(signal);
81
+ }
82
+
83
+ exports.useExtensionSignalValue = useExtensionSignalValue;
84
+ exports.useSignalValue = useSignalValue;
@@ -0,0 +1,81 @@
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
+ */
8
+
9
+ import { useExtensionDependency } from '@lexical/react/useExtensionComponent';
10
+ import { useMemo, useSyncExternalStore } from 'react';
11
+
12
+ /**
13
+ * Copyright (c) Meta Platforms, Inc. and affiliates.
14
+ *
15
+ * This source code is licensed under the MIT license found in the
16
+ * LICENSE file in the root directory of this source tree.
17
+ *
18
+ */
19
+
20
+
21
+ /**
22
+ * A React hook that subscribes to a signal and returns its current value.
23
+ * The component will re-render whenever the signal's value changes.
24
+ *
25
+ * @param s - The ReadonlySignal to subscribe to
26
+ * @returns The current value of the signal
27
+ *
28
+ * @example
29
+ * ```tsx
30
+ * const signal = new Signal(0);
31
+ * function MyComponent() {
32
+ * const value = useSignalValue(signal);
33
+ * return <div>Value: {value}</div>;
34
+ * }
35
+ * ```
36
+ */
37
+ function useSignalValue(s) {
38
+ const [subscribe, getSnapshot] = useMemo(() => [s.subscribe.bind(s), s.peek.bind(s)], [s]);
39
+ return useSyncExternalStore(subscribe, getSnapshot, getSnapshot);
40
+ }
41
+
42
+ /**
43
+ * Type helper that extracts the value type from a ReadonlySignal.
44
+ * If the type is not a ReadonlySignal, it returns never.
45
+ *
46
+ * @example
47
+ * ```tsx
48
+ * type MySignal = ReadonlySignal<number>;
49
+ * type Value = SignalValue<MySignal>; // number
50
+ * ```
51
+ */
52
+
53
+ /**
54
+ * A React hook that subscribes to a signal property from a Lexical extension's output
55
+ * and returns its current value. The component will re-render whenever the signal's value changes.
56
+ *
57
+ * This hook combines the functionality of useExtensionDependency and useSignalValue,
58
+ * providing a convenient way to access reactive values from Lexical extensions.
59
+ *
60
+ * @param extension - The Lexical extension instance
61
+ * @param prop - The property name in the extension's output that contains a signal
62
+ * @returns The current value of the signal property
63
+ *
64
+ * @example
65
+ * ```tsx
66
+ * import {useExtensionSignalValue} from '@lexical/react/useExtensionSignalValue';
67
+ * import {MyExtension} from './MyExtension';
68
+ *
69
+ * function MyComponent() {
70
+ * // Assuming MyExtension has a signal property 'count' in its output
71
+ * const count = useExtensionSignalValue(MyExtension, 'count');
72
+ * return <div>Count: {count}</div>;
73
+ * }
74
+ * ```
75
+ */
76
+ function useExtensionSignalValue(extension, prop) {
77
+ const signal = useExtensionDependency(extension).output[prop];
78
+ return useSignalValue(signal);
79
+ }
80
+
81
+ export { useExtensionSignalValue, useSignalValue };
@@ -0,0 +1,11 @@
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
+ */
8
+
9
+ 'use strict'
10
+ const useLexicalExtensionSignalValue = process.env.NODE_ENV !== 'production' ? require('./useLexicalExtensionSignalValue.dev.js') : require('./useLexicalExtensionSignalValue.prod.js');
11
+ module.exports = useLexicalExtensionSignalValue;
@@ -0,0 +1,18 @@
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
+ * @flow strict
8
+ */
9
+
10
+ import type {ReadonlySignal} from '@lexical/extension';
11
+ import type {AnyLexicalExtension} from 'lexical';
12
+
13
+ declare export function useSignalValue<V>(s: ReadonlySignal<V>): V;
14
+
15
+ declare export function useExtensionSignalValue<V>(
16
+ extension: AnyLexicalExtension,
17
+ prop: string,
18
+ ): V;
@@ -0,0 +1,13 @@
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
+ */
8
+
9
+ import * as modDev from './useLexicalExtensionSignalValue.dev.mjs';
10
+ import * as modProd from './useLexicalExtensionSignalValue.prod.mjs';
11
+ const mod = process.env.NODE_ENV !== 'production' ? modDev : modProd;
12
+ export const useExtensionSignalValue = mod.useExtensionSignalValue;
13
+ export const useSignalValue = mod.useSignalValue;
@@ -0,0 +1,11 @@
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
+ */
8
+
9
+ const mod = await (process.env.NODE_ENV !== 'production' ? import('./useLexicalExtensionSignalValue.dev.mjs') : import('./useLexicalExtensionSignalValue.prod.mjs'));
10
+ export const useExtensionSignalValue = mod.useExtensionSignalValue;
11
+ export const useSignalValue = mod.useSignalValue;
@@ -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
+ */
8
+
9
+ "use strict";var e=require("@lexical/react/useExtensionComponent"),n=require("react");function t(e){const[t,u]=n.useMemo(()=>[e.subscribe.bind(e),e.peek.bind(e)],[e]);return n.useSyncExternalStore(t,u,u)}exports.useExtensionSignalValue=function(n,u){return t(e.useExtensionDependency(n).output[u])},exports.useSignalValue=t;
@@ -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
+ */
8
+
9
+ import{useExtensionDependency as t}from"@lexical/react/useExtensionComponent";import{useMemo as n,useSyncExternalStore as e}from"react";function o(t){const[o,r]=n(()=>[t.subscribe.bind(t),t.peek.bind(t)],[t]);return e(o,r,r)}function r(n,e){return o(t(n).output[e])}export{r as useExtensionSignalValue,o as useSignalValue};
@@ -11,7 +11,7 @@ import type {TextNode} from 'lexical';
11
11
 
12
12
  export type EntityMatch = {end: number, start: number};
13
13
 
14
- declare export function useLexicalTextEntity<N: TextNode>(
14
+ declare export function useLexicalTextEntity<N extends TextNode>(
15
15
  getMatch: (text: string) => null | EntityMatch,
16
16
  targetNode: Class<N>,
17
17
  createNode: (textNode: TextNode) => N,
@@ -1,42 +0,0 @@
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
- */
8
- import type { MenuRenderFn, MenuResolution } from './shared/LexicalMenu';
9
- import type { JSX } from 'react';
10
- import { CommandListenerPriority, LexicalNode } from 'lexical';
11
- import { ReactPortal, RefObject } from 'react';
12
- import { MenuOption } from './shared/LexicalMenu';
13
- export type ContextMenuRenderFn<TOption extends MenuOption> = (anchorElementRef: RefObject<HTMLElement | null>, itemProps: {
14
- selectedIndex: number | null;
15
- selectOptionAndCleanUp: (option: TOption) => void;
16
- setHighlightedIndex: (index: number) => void;
17
- options: Array<TOption>;
18
- }, menuProps: {
19
- setMenuRef: (element: HTMLElement | null) => void;
20
- }) => ReactPortal | JSX.Element | null;
21
- export type LexicalContextMenuPluginProps<TOption extends MenuOption> = {
22
- onSelectOption: (option: TOption, textNodeContainingQuery: LexicalNode | null, closeMenu: () => void, matchingString: string) => void;
23
- options: Array<TOption>;
24
- onClose?: () => void;
25
- onWillOpen?: (event: MouseEvent) => void;
26
- onOpen?: (resolution: MenuResolution) => void;
27
- /**
28
- * @deprecated Use LexicalNodeContextMenuPlugin instead. Here is an example for using NodeContextMenuPlugin:
29
- * https://github.com/facebook/lexical/blob/main/packages/lexical-playground/src/plugins/ContextMenuPlugin/index.tsx
30
- */
31
- menuRenderFn: ContextMenuRenderFn<TOption>;
32
- anchorClassName?: string;
33
- commandPriority?: CommandListenerPriority;
34
- parent?: HTMLElement;
35
- };
36
- /**
37
- * @deprecated Use LexicalNodeContextMenuPlugin instead. It will be removed soon.
38
- * Here is an example for using NodeContextMenuPlugin:
39
- * https://github.com/facebook/lexical/blob/main/packages/lexical-playground/src/plugins/ContextMenuPlugin/index.tsx
40
- */
41
- export declare function LexicalContextMenuPlugin<TOption extends MenuOption>({ options, onWillOpen, onClose, onOpen, onSelectOption, menuRenderFn: contextMenuRenderFn, anchorClassName, commandPriority, parent, }: LexicalContextMenuPluginProps<TOption>): JSX.Element | null;
42
- export { MenuOption, MenuRenderFn, MenuResolution };