@selfcommunity/react-ui
Version:
React UI Components to integrate a Community created with SelfCommunity Platform.
33 lines (32 loc) • 1.61 kB
JavaScript
;
Object.defineProperty(exports, "__esModule", { value: true });
exports.RichTextPlugin = void 0;
const jsx_runtime_1 = require("react/jsx-runtime");
const LexicalComposerContext_1 = require("@lexical/react/LexicalComposerContext");
const useLexicalEditable_1 = require("@lexical/react/useLexicalEditable");
const useDecorators_1 = require("../shared/useDecorators");
const useEditorFocus_1 = require("../shared/useEditorFocus");
const useCanShowPlaceholder_1 = require("../shared/useCanShowPlaceholder");
const useRichTextSetup_1 = require("../shared/useRichTextSetup");
function RichTextPlugin({ contentEditable, placeholder, ErrorBoundary }) {
const [editor] = (0, LexicalComposerContext_1.useLexicalComposerContext)();
const decorators = (0, useDecorators_1.useDecorators)(editor, ErrorBoundary);
(0, useRichTextSetup_1.useRichTextSetup)(editor);
return ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [contentEditable, (0, jsx_runtime_1.jsx)(Placeholder, { content: placeholder }), decorators] }));
}
exports.RichTextPlugin = RichTextPlugin;
function Placeholder({ content }) {
const [editor] = (0, LexicalComposerContext_1.useLexicalComposerContext)();
const showPlaceholder = (0, useCanShowPlaceholder_1.useCanShowPlaceholder)(editor);
const editable = (0, useLexicalEditable_1.useLexicalEditable)();
const hasFocus = (0, useEditorFocus_1.useEditorFocus)();
if (!showPlaceholder || hasFocus) {
return null;
}
if (typeof content === 'function') {
return content(editable);
}
else {
return content;
}
}