You have access to component elements by using ...Render props.

E.g. wrapperRender gives you access to the outer wrapper of a component.

Each ...Render prop requires a function:

RenderEvent => React.ReactNode

Each component has its own set of customizators, see the documentation.

RenderEvent props

ElementThe element, use it or replace it to a different one
elementPropsElement props, all you need to make the element work properly
componentPropsComponent props in case you need something from the outer space
componentStateThe component state in case you need to know what is going on in there

A few examples

Adding attributes to elements:

  inputRender={({ Element, elementProps }) => <Element {...elementProps} aria-test-attribute />}

Completely replacing Element with another:

  wrapperRender={({ elementProps }) => <span {...elementProps} />}

Or make a whatever combination you like.

The only thing is that a valid React node must be returned.