title: Is there a way to change Typography defaults in a component?
body: <p>The default variant and color of the <a href="https://material-ui.com/api/typography/#props" rel="nofollow noreferrer">Typography component</a> is <code>body1</code> and <code>initial</code>. I've made a component, and when the Typography component is used as children of it, I'd like the default to instead be <code>body2</code> and <code>textSecondary</code>. Is there a way to do this in Material UI?</p>
  
  <pre><code>&lt;Sidebar&gt;
    &lt;Typography&gt;
      This should have body2 and textSecondary 
      when nothing else is specified.
    &lt;/Typography&gt;
  &lt;/Sidebar&gt;
  
  &lt;Typography&gt;
    This should have the regular defaults.
  &lt;/Typography&gt;
  </code></pre>
  
  <p>I can of course do the following, but would really prefer a way where the child components could still use the regular Typography component. Or if there's a way to extend/create an alternative Typography component that doesn't result in two components like here (the wrapper and the wrapped typography component).</p>
  
  <pre><code>import React from 'react';
  import Typography, { TypographyProps } from 'components/Typography';
  
  export default function SidebarTypography({
    variant = 'body2',
    color = 'textSecondary',
    ...props
  }: TypographyProps): React.ReactElement {
    return &lt;Typography variant={variant} color={color} {...props} /&gt;;
  }
  </code></pre>
  
  <pre><code>&lt;Sidebar&gt;
    &lt;SidebarTypography&gt;
      This has body2 and textSecondary.
    &lt;/SidebarTypography&gt;
  &lt;/Sidebar&gt;
  
  &lt;Typography&gt;
    This has the regular defaults.
  &lt;/Typography&gt;
  </code></pre>