How to use the @patternfly/react-styles/css/components/FormControl/form-control.formControl function in @patternfly/react-styles

render() {
    const { className, value, onChange, isValid, validated, isRequired, resizeOrientation, ...props } = this.props;
    const orientation = 'resize' + resizeOrientation.charAt(0).toUpperCase() + resizeOrientation.slice(1);
    return (
      <textarea required="{isRequired}" aria-invalid="{!isValid" value="">    );
  }
}</textarea>

className,
      type,
      value,
      onChange,
      isValid,
      validated,
      isReadOnly,
      isRequired,
      isDisabled,
      ...props
    } = this.props;
    return (
      <input readonly="{isReadOnly}" disabled="{isDisabled}" required="{isRequired}" aria-invalid="{!isValid" value="{value}" type="{type}">
    );
  }
}

aria-label={ariaLabelClear}
                    type="button"
                    disabled={isDisabled}
                  >
                    
                  
                )}
              
            )}
            {variant === SelectVariant.typeaheadMulti && !customContent && (
              
                <div>
                  {toggleIcon &amp;&amp; <span>{toggleIcon}</span>}
                  {selections &amp;&amp; (Array.isArray(selections) &amp;&amp; selections.length &gt; 0) &amp;&amp; selectedChips}
                  <input disabled="{isDisabled}" autocomplete="off" type="text" value="{typeaheadInputValue" placeholder="{placeholderText" aria-label="{ariaLabelTypeAhead}" id="select-multi-typeahead-typeahead" aria-activedescendant="{typeaheadActiveChild">
                </div>
                {selections &amp;&amp; (Array.isArray(selections) &amp;&amp; selections.length &gt; 0) &amp;&amp; (

createSearchBox = () => {
    const { onSearch, searchPlaceholderText, searchProps } = this.props;

    return (
      <div>
         onSearch(e.target.value)}
              {...searchProps}
            &gt;
          }
        &gt;
      </div>
    );
  };

{toggleIcon &amp;&amp; <span>{toggleIcon}</span>}
                  <span>{placeholderText}</span>
                  {selections &amp;&amp; (Array.isArray(selections) &amp;&amp; selections.length &gt; 0) &amp;&amp; (
                    <div>
                      <span>{selections.length}</span>
                    </div>
                  )}
                
              
            )}
            {variant === SelectVariant.typeahead &amp;&amp; !customContent &amp;&amp; (
              
                <div>
                  {toggleIcon &amp;&amp; <span>{toggleIcon}</span>}
                  <input disabled="{isDisabled}" autocomplete="off" type="text" value="{" placeholder="{placeholderText" aria-label="{ariaLabelTypeAhead}" id="select-typeahead" aria-activedescendant="{typeaheadActiveChild"></div>