@depup/lexical__react 0.42.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.
- package/LexicalAutoFocusPlugin.js.flow +1 -1
- package/LexicalBlockWithAlignableContents.js.flow +2 -2
- package/LexicalClearEditorPlugin.js.flow +1 -1
- package/LexicalComposer.js.flow +2 -2
- package/LexicalContentEditable.js.flow +6 -6
- package/LexicalDraggableBlockPlugin.js.flow +1 -1
- package/LexicalEditorRefPlugin.d.ts +1 -1
- package/LexicalEditorRefPlugin.dev.js +0 -1
- package/LexicalEditorRefPlugin.dev.mjs +0 -1
- package/LexicalEditorRefPlugin.js.flow +1 -1
- package/LexicalErrorBoundary.js.flow +1 -1
- package/LexicalHorizontalRulePlugin.js.flow +1 -1
- package/LexicalLinkPlugin.js.flow +1 -1
- package/LexicalNestedComposer.js.flow +1 -1
- package/LexicalPlainTextPlugin.dev.js +0 -3
- package/LexicalPlainTextPlugin.dev.mjs +0 -3
- package/LexicalReactExtension.dev.js +1 -3
- package/LexicalReactExtension.dev.mjs +1 -3
- package/LexicalReactExtension.js.flow +1 -1
- package/LexicalReactPluginHostExtension.js.flow +3 -3
- package/LexicalRichTextPlugin.dev.js +0 -3
- package/LexicalRichTextPlugin.dev.mjs +0 -3
- package/LexicalTabIndentationPlugin.js.flow +1 -1
- package/LexicalTablePlugin.js.flow +1 -1
- package/README.md +2 -2
- package/changes.json +1 -1
- package/package.json +50 -20
- package/useExtensionSignalValue.d.ts +61 -0
- package/useLexicalExtensionSignalValue.dev.js +84 -0
- package/useLexicalExtensionSignalValue.dev.mjs +81 -0
- package/useLexicalExtensionSignalValue.js +11 -0
- package/useLexicalExtensionSignalValue.js.flow +18 -0
- package/useLexicalExtensionSignalValue.mjs +13 -0
- package/useLexicalExtensionSignalValue.node.mjs +11 -0
- package/useLexicalExtensionSignalValue.prod.js +9 -0
- package/useLexicalExtensionSignalValue.prod.mjs +9 -0
- package/useLexicalTextEntity.js.flow +1 -1
|
@@ -15,11 +15,11 @@ import type {
|
|
|
15
15
|
NodeKey,
|
|
16
16
|
} from 'lexical';
|
|
17
17
|
|
|
18
|
-
type Props =
|
|
18
|
+
type Props = Readonly<{
|
|
19
19
|
children: React.Node,
|
|
20
20
|
format: ?ElementFormatType,
|
|
21
21
|
nodeKey: NodeKey,
|
|
22
|
-
className:
|
|
22
|
+
className: Readonly<{
|
|
23
23
|
base: string,
|
|
24
24
|
focus: string,
|
|
25
25
|
}>,
|
package/LexicalComposer.js.flow
CHANGED
|
@@ -22,10 +22,10 @@ export type InitialEditorStateType =
|
|
|
22
22
|
| EditorState
|
|
23
23
|
| ((editor: LexicalEditor) => void);
|
|
24
24
|
|
|
25
|
-
export type InitialConfigType =
|
|
25
|
+
export type InitialConfigType = Readonly<{
|
|
26
26
|
editable?: boolean,
|
|
27
27
|
namespace: string,
|
|
28
|
-
nodes?:
|
|
28
|
+
nodes?: ReadonlyArray<Class<LexicalNode> | LexicalNodeReplacement>,
|
|
29
29
|
theme?: EditorThemeClasses,
|
|
30
30
|
editorState?: InitialEditorStateType,
|
|
31
31
|
onError: (error: Error, editor: LexicalEditor) => void,
|
|
@@ -14,11 +14,11 @@ import type {TRefFor} from 'CoreTypes.flow';
|
|
|
14
14
|
import * as React from 'react';
|
|
15
15
|
|
|
16
16
|
type InlineStyle = {
|
|
17
|
-
[key: string]:
|
|
17
|
+
[key: string]: unknown,
|
|
18
18
|
};
|
|
19
19
|
|
|
20
20
|
// Due to Flow limitations, we prefer fixed types over the built-in inexact HTMLElement
|
|
21
|
-
type HTMLDivElementDOMProps =
|
|
21
|
+
type HTMLDivElementDOMProps = Readonly<{
|
|
22
22
|
'aria-label'?: void | string,
|
|
23
23
|
'aria-labeledby'?: void | string,
|
|
24
24
|
'aria-activedescendant'?: void | string,
|
|
@@ -28,7 +28,7 @@ type HTMLDivElementDOMProps = $ReadOnly<{
|
|
|
28
28
|
'aria-invalid'?: void | boolean,
|
|
29
29
|
'aria-owns'?: void | string,
|
|
30
30
|
'title'?: void | string,
|
|
31
|
-
onClick?: void | ((e: SyntheticEvent<HTMLDivElement>) =>
|
|
31
|
+
onClick?: void | ((e: SyntheticEvent<HTMLDivElement>) => unknown),
|
|
32
32
|
autoCapitalize?: void | boolean,
|
|
33
33
|
autoComplete?: void | boolean,
|
|
34
34
|
autoCorrect?: void | boolean,
|
|
@@ -44,11 +44,11 @@ type HTMLDivElementDOMProps = $ReadOnly<{
|
|
|
44
44
|
}>;
|
|
45
45
|
|
|
46
46
|
export type PlaceholderProps =
|
|
47
|
-
|
|
|
47
|
+
| Readonly<{
|
|
48
48
|
'aria-placeholder'?: void,
|
|
49
49
|
placeholder?: null,
|
|
50
50
|
}>
|
|
51
|
-
|
|
|
51
|
+
| Readonly<{
|
|
52
52
|
'aria-placeholder': string,
|
|
53
53
|
placeholder:
|
|
54
54
|
| ((isEditable: boolean) => null | React.Node)
|
|
@@ -56,7 +56,7 @@ export type PlaceholderProps =
|
|
|
56
56
|
| React.Node,
|
|
57
57
|
}>;
|
|
58
58
|
|
|
59
|
-
export type Props =
|
|
59
|
+
export type Props = Readonly<{
|
|
60
60
|
...HTMLDivElementDOMProps,
|
|
61
61
|
ariaActiveDescendant?: string,
|
|
62
62
|
ariaAutoComplete?: string,
|
|
@@ -18,7 +18,7 @@ export type LexicalNestedComposerProps = {
|
|
|
18
18
|
children?: React.Node;
|
|
19
19
|
initialEditor: LexicalEditor;
|
|
20
20
|
initialTheme?: EditorThemeClasses;
|
|
21
|
-
initialNodes?:
|
|
21
|
+
initialNodes?: ReadonlyArray<Class<LexicalNode> | LexicalNodeReplacement>;
|
|
22
22
|
skipCollabChecks?: void | true;
|
|
23
23
|
skipEditableListener?: void | true;
|
|
24
24
|
};
|
|
@@ -183,9 +183,6 @@ function useCanShowPlaceholder(editor) {
|
|
|
183
183
|
function usePlainTextSetup(editor) {
|
|
184
184
|
useLayoutEffectImpl(() => {
|
|
185
185
|
return utils.mergeRegister(plainText.registerPlainText(editor), dragon.registerDragonSupport(editor));
|
|
186
|
-
|
|
187
|
-
// We only do this for init
|
|
188
|
-
// eslint-disable-next-line react-hooks/exhaustive-deps
|
|
189
186
|
}, [editor]);
|
|
190
187
|
}
|
|
191
188
|
|
|
@@ -181,9 +181,6 @@ function useCanShowPlaceholder(editor) {
|
|
|
181
181
|
function usePlainTextSetup(editor) {
|
|
182
182
|
useLayoutEffectImpl(() => {
|
|
183
183
|
return mergeRegister(registerPlainText(editor), registerDragonSupport(editor));
|
|
184
|
-
|
|
185
|
-
// We only do this for init
|
|
186
|
-
// eslint-disable-next-line react-hooks/exhaustive-deps
|
|
187
184
|
}, [editor]);
|
|
188
185
|
}
|
|
189
186
|
|
|
@@ -91,9 +91,7 @@ function buildEditorComponent(config, context) {
|
|
|
91
91
|
const configDecorators = react.useMemo(() => rawConfigDecorators.map((decorator, i) => /*#__PURE__*/jsxRuntime.jsx(ErrorBoundary, {
|
|
92
92
|
onError: e => {
|
|
93
93
|
editor._onError(e);
|
|
94
|
-
}
|
|
95
|
-
// eslint-disable-next-line react/no-array-index-key -- no natural key
|
|
96
|
-
,
|
|
94
|
+
},
|
|
97
95
|
children: /*#__PURE__*/jsxRuntime.jsx(react.Suspense, {
|
|
98
96
|
fallback: null,
|
|
99
97
|
children: decorator
|
|
@@ -89,9 +89,7 @@ function buildEditorComponent(config, context) {
|
|
|
89
89
|
const configDecorators = useMemo(() => rawConfigDecorators.map((decorator, i) => /*#__PURE__*/jsx(ErrorBoundary, {
|
|
90
90
|
onError: e => {
|
|
91
91
|
editor._onError(e);
|
|
92
|
-
}
|
|
93
|
-
// eslint-disable-next-line react/no-array-index-key -- no natural key
|
|
94
|
-
,
|
|
92
|
+
},
|
|
95
93
|
children: /*#__PURE__*/jsx(Suspense, {
|
|
96
94
|
fallback: null,
|
|
97
95
|
children: decorator
|
|
@@ -46,7 +46,7 @@ export type ReactConfig = {
|
|
|
46
46
|
contentEditable: React.Node | null;
|
|
47
47
|
ErrorBoundary: ErrorBoundaryType;
|
|
48
48
|
EditorChildrenComponent: EditorChildrenComponentType;
|
|
49
|
-
decorators:
|
|
49
|
+
decorators: ReadonlyArray<DecoratorComponentType>;
|
|
50
50
|
};
|
|
51
51
|
|
|
52
52
|
export type ReactOutputs = {
|
|
@@ -24,7 +24,7 @@ export type {DecoratorComponentProps};
|
|
|
24
24
|
|
|
25
25
|
type Container = DocumentFragment | Element;
|
|
26
26
|
// TODO: Not sure how to import RootType from react-dom/client
|
|
27
|
-
type Root =
|
|
27
|
+
type Root = unknown;
|
|
28
28
|
|
|
29
29
|
export interface HostMountCommandArg {
|
|
30
30
|
root: Root;
|
|
@@ -37,7 +37,7 @@ export interface MountPluginCommandArg {
|
|
|
37
37
|
}
|
|
38
38
|
|
|
39
39
|
declare export function mountReactExtensionComponent<
|
|
40
|
-
Extension
|
|
40
|
+
Extension extends AnyLexicalExtension,
|
|
41
41
|
>(
|
|
42
42
|
editor: LexicalEditor,
|
|
43
43
|
opts: {
|
|
@@ -54,7 +54,7 @@ declare export function mountReactExtensionComponent<
|
|
|
54
54
|
): void;
|
|
55
55
|
|
|
56
56
|
declare export function mountReactPluginComponent<
|
|
57
|
-
P
|
|
57
|
+
P extends {...} = {...},
|
|
58
58
|
>(
|
|
59
59
|
editor: LexicalEditor,
|
|
60
60
|
opts: {
|
|
@@ -183,9 +183,6 @@ function useCanShowPlaceholder(editor) {
|
|
|
183
183
|
function useRichTextSetup(editor) {
|
|
184
184
|
useLayoutEffectImpl(() => {
|
|
185
185
|
return utils.mergeRegister(richText.registerRichText(editor), dragon.registerDragonSupport(editor));
|
|
186
|
-
|
|
187
|
-
// We only do this for init
|
|
188
|
-
// eslint-disable-next-line react-hooks/exhaustive-deps
|
|
189
186
|
}, [editor]);
|
|
190
187
|
}
|
|
191
188
|
|
|
@@ -181,9 +181,6 @@ function useCanShowPlaceholder(editor) {
|
|
|
181
181
|
function useRichTextSetup(editor) {
|
|
182
182
|
useLayoutEffectImpl(() => {
|
|
183
183
|
return mergeRegister(registerRichText(editor), registerDragonSupport(editor));
|
|
184
|
-
|
|
185
|
-
// We only do this for init
|
|
186
|
-
// eslint-disable-next-line react-hooks/exhaustive-deps
|
|
187
184
|
}, [editor]);
|
|
188
185
|
}
|
|
189
186
|
|
package/README.md
CHANGED
|
@@ -13,8 +13,8 @@ npm install @depup/lexical__react
|
|
|
13
13
|
|
|
14
14
|
| Field | Value |
|
|
15
15
|
|-------|-------|
|
|
16
|
-
| Original | [@lexical/react](https://www.npmjs.com/package/@lexical/react) @ 0.
|
|
17
|
-
| Processed | 2026-
|
|
16
|
+
| Original | [@lexical/react](https://www.npmjs.com/package/@lexical/react) @ 0.43.0 |
|
|
17
|
+
| Processed | 2026-04-09 |
|
|
18
18
|
| Smoke test | failed |
|
|
19
19
|
| Deps updated | 2 |
|
|
20
20
|
|
package/changes.json
CHANGED
package/package.json
CHANGED
|
@@ -14,26 +14,26 @@
|
|
|
14
14
|
"rich-text"
|
|
15
15
|
],
|
|
16
16
|
"license": "MIT",
|
|
17
|
-
"version": "0.
|
|
17
|
+
"version": "0.43.0-depup.0",
|
|
18
18
|
"dependencies": {
|
|
19
19
|
"@floating-ui/react": "^0.27.19",
|
|
20
|
-
"@lexical/devtools-core": "0.
|
|
21
|
-
"@lexical/dragon": "0.
|
|
22
|
-
"@lexical/extension": "0.
|
|
23
|
-
"@lexical/hashtag": "0.
|
|
24
|
-
"@lexical/history": "0.
|
|
25
|
-
"@lexical/link": "0.
|
|
26
|
-
"@lexical/list": "0.
|
|
27
|
-
"@lexical/mark": "0.
|
|
28
|
-
"@lexical/markdown": "0.
|
|
29
|
-
"@lexical/overflow": "0.
|
|
30
|
-
"@lexical/plain-text": "0.
|
|
31
|
-
"@lexical/rich-text": "0.
|
|
32
|
-
"@lexical/table": "0.
|
|
33
|
-
"@lexical/text": "0.
|
|
34
|
-
"@lexical/utils": "0.
|
|
35
|
-
"@lexical/yjs": "0.
|
|
36
|
-
"lexical": "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": {
|
|
@@ -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.
|
|
1569
|
-
"processedAt": "2026-
|
|
1598
|
+
"originalVersion": "0.43.0",
|
|
1599
|
+
"processedAt": "2026-04-09T20:22:39.300Z",
|
|
1570
1600
|
"smokeTest": "failed"
|
|
1571
1601
|
}
|
|
1572
1602
|
}
|
|
@@ -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]>;
|
|
@@ -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
|
|
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,
|