@lexical/react
Version:
This package provides Lexical components and hooks for React applications.
65 lines (56 loc) • 2.15 kB
JavaScript
/**
* Copyright (c) Meta Platforms, Inc. and affiliates.
*
* This source code is licensed under the MIT license found in the
* LICENSE file in the root directory of this source tree.
*
*/
import { $isRootTextContentEmptyCurry } from '@lexical/text';
import { useLayoutEffect, useEffect, useState } from 'react';
import { CAN_USE_DOM } from 'lexical';
/**
* Copyright (c) Meta Platforms, Inc. and affiliates.
*
* This source code is licensed under the MIT license found in the
* LICENSE file in the root directory of this source tree.
*
*/
// This workaround is no longer necessary in React 19,
// but we currently support React >=18.x
// https://github.com/facebook/react/pull/26395
const useLayoutEffectImpl = CAN_USE_DOM ? useLayoutEffect : useEffect;
/**
* Copyright (c) Meta Platforms, Inc. and affiliates.
*
* This source code is licensed under the MIT license found in the
* LICENSE file in the root directory of this source tree.
*
*/
/**
* Tracks whether the editor's text content is empty, updating as the editor
* changes. Pass `trim` to ignore leading and trailing whitespace when deciding
* emptiness.
*
* @returns `true` while the editor's text content is empty.
*/
function useLexicalIsTextContentEmpty(editor, trim) {
const [isEmpty, setIsEmpty] = useState(() => editor.read('latest', $isRootTextContentEmptyCurry(editor.isComposing(), trim)));
useLayoutEffectImpl(() => {
function resetIsEmpty() {
setIsEmpty(editor.read('latest', $isRootTextContentEmptyCurry(editor.isComposing(), trim)));
}
// The state was seeded on the first render only, so re-derive it whenever
// the inputs the effect depends on change -- otherwise a new editor or a
// new trim keeps reporting the previous answer until the next update.
resetIsEmpty();
return editor.registerUpdateListener(({
editorState
}) => {
const isComposing = editor.isComposing();
const currentIsEmpty = editorState.read($isRootTextContentEmptyCurry(isComposing, trim));
setIsEmpty(currentIsEmpty);
});
}, [editor, trim]);
return isEmpty;
}
export { useLexicalIsTextContentEmpty };