File size: 1,883 Bytes
4304c6d |
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 |
import {
memo,
useCallback,
useEffect,
} from 'react'
import { $applyNodeReplacement } from 'lexical'
import { mergeRegister } from '@lexical/utils'
import { useLexicalComposerContext } from '@lexical/react/LexicalComposerContext'
import { decoratorTransform } from '../../utils'
import { CONTEXT_PLACEHOLDER_TEXT } from '../../constants'
import type { ContextBlockType } from '../../types'
import {
$createContextBlockNode,
ContextBlockNode,
} from '../context-block/node'
import { CustomTextNode } from '../custom-text/node'
const REGEX = new RegExp(CONTEXT_PLACEHOLDER_TEXT)
const ContextBlockReplacementBlock = ({
datasets = [],
onAddContext = () => {},
onInsert,
canNotAddContext,
}: ContextBlockType) => {
const [editor] = useLexicalComposerContext()
useEffect(() => {
if (!editor.hasNodes([ContextBlockNode]))
throw new Error('ContextBlockNodePlugin: ContextBlockNode not registered on editor')
}, [editor])
const createContextBlockNode = useCallback((): ContextBlockNode => {
if (onInsert)
onInsert()
return $applyNodeReplacement($createContextBlockNode(datasets, onAddContext, canNotAddContext))
}, [datasets, onAddContext, onInsert, canNotAddContext])
const getMatch = useCallback((text: string) => {
const matchArr = REGEX.exec(text)
if (matchArr === null)
return null
const startOffset = matchArr.index
const endOffset = startOffset + CONTEXT_PLACEHOLDER_TEXT.length
return {
end: endOffset,
start: startOffset,
}
}, [])
useEffect(() => {
REGEX.lastIndex = 0
return mergeRegister(
editor.registerNodeTransform(CustomTextNode, textNode => decoratorTransform(textNode, getMatch, createContextBlockNode)),
)
}, [])
return null
}
export default memo(ContextBlockReplacementBlock)
|