Pass data by context (HOC) React

Well, I'm doing a forms system on react. I'm using the context to pass some information to the child components. The project structure is as follows:

/ context - Where I have saved the context

import React from "react";
const FormContext = React.createContext();
export { FormContext };

/Form.js - Parent component

import React, { Component } from "react";
import { FormContext } from "./context/index";

export default class Form extends Component {
  constructor(props) {
    super(props);
  }
  render() {
    return (
      <FormContext.Provider values={{ value: "teste" }}>
        {this.props.children}
      </FormContext.Provider>
    );
  }
}

withFormContext.js - HOC to pass context

import React from "react";
import { FormContext } from "../context/index";
const withFormContext = Component => (
  <FormContext.Consumer>
    {({ controller }) => <Component controller={controller} {...this.props} />}
  </FormContext.Consumer>
);

export default withFormContext;

/TextInput.js - Form Text Element

import React from "react";
import { withFormContext } from "../HOC/withFormContext";

const TextInput = ({ ...props }) => {
  console.log(props);
  return <input type="text" />;
};
export default withFormContext(TextInput);

App.js - Component that will call form

import React, { Component } from "react";
import ReactDOM from "react-dom";
import Form from "./libs/forms/Form";
import TextInput from "./libs/forms/components/TextInput";

class App extends Component {
  render() {
    return (
      <div className="container">
        <Form nameForm="xxxxx">
          <TextInput />
        </Form>
      </div>
    );
  }
}

It turns out that I can not pass the properties to the TextInput.js component through the HOC. Can you help me or in your opinion what should I use in this type of situation?