How to add a class to an element from another component?

Question

React

Here is the first file:

<div className="form__item">
    <NameInput refNameInput={this.nameInput} />
</div>

Here is the second file:

export default class NameInput extends React.Component<MyType> {
  constructor(props: MyType) {
    super(props);
  }

  render() {
    return (
      <>
        <label htmlFor="formName" className="form__label">
          Name:
        </label>
        <input
          ref={this.props.refNameInput}
          minLength={4}
          type="text"
          id="formName"
          name="name"
          className="form__input"
        />
      </>
    );
  }
}

How can I add an error class from 1 file to input from 2 files?

Answer 1

The parent is the first file, I import the second in 1

depending on what you mean by "pass the class".
If you want to switch the class on an element in the child component from the parent, then pass a boolean variable as prop to the child element, for example. Depending on this value, add/ remove class error
<div className={isError ? 'error' : '')}>
<div style={errorClassStyles}>