Проставить className для child React компонента

есть сторонний компонент, который предоставляет текстовый input

import {TextField} from package;

const myForm = () => {

    return (
        <TextField name="name" .../>
    );
}

TextField в html представляет из себя div контейнер, который содержит в себе input. Что-то вроде того:

<div>
    <input name="name" id="id" value="">
</div>

Мне нужно проставить className для input, чтобы к нему применились нужные мне стили

проблема в том, что если я добавляю className для компонента TextField

<TextField name="name" className="classCss".../>

он применяется для внешнего div

<div class="classCss">
    <input name="name" id="id" value="">
</div>

а это мне не подходит

Насколько я понял, мне подойдет вариант перебрать всех child от этого компонента и заменить их на склонированные child с нужным классом

что-то типа:

<TextField ...>
    {
        this.props.children.map((el, index) => {
            return React.cloneElement(el, {
                key: index,
                className: el.className + " classCss"
            });
        })
    }
</TextField>

но я не могу понять, как получить доступ к child (и props) импортированного компонента