title: How can i build or obtain a list of HTML valid props that should always be forwarded to a DOM element while using material-ui?
body: <p>im struggling with this weird behavior when using <code>styled</code> from the @mui/material library.</p>
  <p>I'm being forced to add the <code>shouldForwardProp: (prop) =&gt; ...</code> function everywhere where properties are forwarded to the DOM element and then i see console warnings about the prop not being recognized.</p>
  <p>While using other style systems or libraries i never had to specify one by one all the props i want to not forward, so im trying to create a util function i can just add to components that have special props i want to avoid being forwarded.</p>
  <p>Ideally i would like to have something like:</p>
  <pre><code>import { expectedProps } from 'someLibrary or mui itself?'
  
  export const shouldForwardProp: (prop) =&gt; expectedProps.includes(prop)
  </code></pre>
  <p>So then i can just add it to any component that has non-html props like</p>
  <pre><code>import { shouldForwardProp } from '../util'
  
  const MyComponent = styled(SomeMUIComponent, { shouldForwardProp } )`
  ...
  `
  
  &lt;MyComponent someCustomPropAutomaticallyNotForwarded={true} /&gt;
  </code></pre>
  <p>Is there a way to achieve this or am I doomed to list every prop I'm adding to my components?</p>