Error reported after using reactflow Handle in createJdmNode

[distance321]

I customized a node in renderNode. The Handle component is used inside the node. An error occurred after dragging it to the canvas. Error: [React Flow]: Seems like you have not used zustand provider as an ancestor. The error can be resolved after the external ReactFlowProvider is added, but a new problem appears [React Flow]: Handle: No node id found. Make sure to only use a Handle inside a custom Node.

[distance321]

A very simple example can reproduce the above problem

` function TextUpdaterNode() { const onChange = useCallback(evt => { console.log(evt.target.value); }, []);

return (
    <>
        <Handle type="target" position={Position.Top} />
        <div>
            <label htmlFor="text">Text:</label>
            <input id="text" name="text" onChange={onChange} className="nodrag" />
        </div>
        <Handle type="source" position={Position.Bottom} id="a" />
        <Handle type="source" position={Position.Bottom} id="b" style={handleStyle} />
    </>
);

}

... const [value, setValue] = useState({});

const customNodes = useMemo(() => {
    return [
        createJdmNode({
            kind: 'textUpdaterNode',
            displayName: 'textUpdater',
            renderNode: () => <TextUpdaterNode />
        })
    ];
}, []);

return (

{ Logger.log(val); setValue?.(val); }} customNodes={customNodes} />

)

`

[distance321]

If I don't want to fork this project and implement this custom node in this project, what better solution is there? Looking forward to your answer, thank you.