title: How to set state for text box in functional component
body: <p>I am working on React JS. I have one text-box component and I want to show some default value in it. After that, the user should be allowed to change the value. Now I am unable to change the value. The text box is behaving like read-only. Below is my code</p>
  
  <pre><code>const EditStyleFormComponent = ({
  submitting,
  invalid,
  }) =&gt; (
    &lt;form className={className} onSubmit={handleSubmit}&gt;
      &lt;h2&gt;LSPL (Low Stock Presentation Level)&lt;/h2&gt;
      &lt;Line /&gt;
      &lt;InputGroup&gt;
         &lt;TextFieldWithValidation name="lsplMan" label="LSPL Manual" input={{ onChnage:'', value: 'Current' }} /&gt;
      &lt;/InputGroup&gt;
   &lt;/form&gt;
  );
  </code></pre>
  
  <p>Below is my TextFieldWithValidation code.</p>
  
  <pre><code>export const TextFieldWithValidationComponent = ({
    meta,
    input,
    noStyles,
    ...otherProps
  }) =&gt; (
    &lt;TextField
      state={noStyles ? textFieldStates.DEFAULT : getState(meta)}
      errorMessage={meta.touched ? meta.error : null}
      {...input}
      {...otherProps}
    /&gt;
  );
  </code></pre>
  
  <p>Below is my TextField code.</p>
  
  <pre><code>const TextField = ({
    className,
    label,
    description,
    state,
    errorMessage,
    isEditable,
    spaceAtBottom, // Not used, but we don't want it in otherProps
    ...otherProps
  }) =&gt; {
    const inputId = _.uniqueId();
  
    return (
      &lt;div className={className}&gt;
        {label &amp;&amp;
          &lt;label htmlFor={inputId}&gt;{label}&lt;/label&gt;
        }
        &lt;div className="input-group" id={isEditable ? 'editable' : 'readonly'}&gt;
          &lt;input
            id={inputId}
            readOnly={!isEditable}
            {...otherProps}
          /&gt;
          {getStatusIcon(state)}
          {errorMessage &amp;&amp;
            &lt;Error&gt;{errorMessage}&lt;/Error&gt;
          }
          {description &amp;&amp;
            &lt;Description&gt;{description}&lt;/Description&gt;
          }
        &lt;/div&gt;
      &lt;/div&gt;
    );
  };
  </code></pre>
  
  <p>Can someone help me to fix this issue? Any help would be appreciated. Thanks</p>