Modify DOM Element by ref in another componet

Question

I want to modify the text of a label in another component passing to the last the refs to the label in a props.

const withLabelGroup = (Component, label, groupProps, labelStyle="") => {

    const xxx = forwardRef((props, ref) => {
        
        const labelRef = useRef(null);

        const initLabelRef = useCallback(
            (node) => labelRef.current = node
        ,[])


        return (
            <Form.Group {...groupProps} >
                <Form.Label id={props.id+"Label"} ref={initLabelRef} className={labelStyle}>{label}</Form.Label>
                <Component ref={ref} labelRef={labelRef} {...props} />
            </Form.Group>
        );
    });

    xxx.displayName = "withLabelGroup";
    return xxx;
}

export default withLabelGroup;

But meanwhile in HOC I can read and write the label using labelRef.current.textContent inside Component I can only read the label text with props.labelRef.current.textContent, but when I try to write it I got the error 'Invalid left-hand side in assignment'