title: React Informed eslint associated control error after adding "Text" as control component
body: <p>I am trying to add the <code>informed</code> package to my project, but I am getting the eslint an error when I add the components like this:</p>
  
  <pre><code>    &lt;Form id="intro-form"&gt;
        &lt;label htmlFor="intro-name"&gt;
          First name:
          &lt;Text field="name" id="intro-name" /&gt;
        &lt;/label&gt;
        &lt;button type="submit"&gt;Submit&lt;/button&gt;
      &lt;/Form&gt;
  </code></pre>
  
  <p>I have added <code>Text</code> to my <code>.eslintrc</code> as a <code>controlComponent</code> and I am still getting the error:</p>
  
  <p><code>eslint] Form label must have ALL of the following types of associated control: nesting, id (jsx-a11y/label-has-for)</code></p>
  
  <p>I'm guessing this is not the correct way to add this to my <code>.eslintrc</code> file?</p>
  
  <pre><code>{
      "rules": {
        "jsx-a11y/label-has-associated-control": [ 2, {
          "labelComponents": ["label"],
          "labelAttributes": ["htmlFor"],
          "controlComponents": ["Text"]
        }]
    },
      "parser": "babel-eslint",
      "extends": [
        "airbnb"
      ]
    }
  </code></pre>
  
  <p>When I change <code>Text</code> to <code>input</code> the error goes away, so it feels like I'm misunderstanding how this works. Any suggestions for how to allow <code>Text</code> as an acceptable <code>input</code>?</p>