title: Erroneously (?) getting a "non-unique id" warning in Chrome
body: <p>This is a Next.js project with Mantine as a component library. Copied their login form example, made a few changes and now I'm getting this warning in Chrome's console.</p>
  <pre><code>[DOM] Found 3 elements with non-unique id #: (More info: &lt;the link to google&gt;) 
  &lt;input placeholder=​&quot;your@email.com&quot; id=​&quot;mantine-mj0krggdl&quot; type=​&quot;text&quot; required aria-invalid=​&quot;false&quot; class=​&quot;mantine-TextInput-defaultVariant mantine-TextInput-input mantine-g773hu&quot; value&gt;​ 
  &lt;input placeholder=​&quot;Your password...&quot; id=​&quot;mantine-jyfhjrdw4&quot; type=​&quot;password&quot; required aria-invalid=​&quot;false&quot; class=​&quot;mantine-TextInput-defaultVariant mantine-TextInput-input mantine-g773hu&quot; value&gt;​
  &lt;input id=​&quot;mantine-3wbj5hy47&quot; type=​&quot;checkbox&quot; class=​&quot;mantine-1590boo mantine-Checkbox-input&quot;&gt;​
  </code></pre>
  <p>Their ids are clearly different. There are no other warnings/errors so what did am I missing?</p>
  <p>Thanks!</p>