title: Material-UI Theme Overrides Leveraging Theme Palette Colors
body: <p>I'm currently customizing a few components using global theme overrides in the hopes of maintaining as much of the integrity of the Material-UI theming engine as possible.  I know I could accomplish what I'm trying to do using composition, but I want to see if it's possible to achieve this via overrides.</p>
  
  <p><strong>The Goal</strong></p>
  
  <p>Change the background color of the BottomNavigation component to use the primary color of the current theme, and ensure the label gets a color that is legible on top of that background color.</p>
  
  <p><strong>My Current Approach</strong></p>
  
  <pre><code>const theme = createMuiTheme({
      palette: {
        primary: {
          main: 'rgba(217,102,102,1)'
        }
      },
      overrides: {
          MuiBottomNavigation: {
              root: {
                  backgroundColor: 'rgba(217,102,102,1)'
              }
          },
          MuiBottomNavigationAction: {
              wrapper: {
                  color: '#fff'
              }
          }
      }
  });
  </code></pre>
  
  <p>This code accomplishes the task and turns the bottom navigation red and the label/icons white.  However, I want the flexibility of being able to change the primary color in the palette and have the component update accordingly.</p>
  
  <p><strong>What I'm Trying To Do</strong></p>
  
  <pre><code>const theme = createMuiTheme({
      palette: {
        primary: {
          main: 'rgba(217,102,102,1)'
        }
      },
      overrides: {
          MuiBottomNavigation: {
              root: {
                  backgroundColor: 'primary.main'
              }
          },
          MuiBottomNavigationAction: {
              wrapper: {
                  color: 'primary.contrastText'
              }
          }
      }
  });
  </code></pre>
  
  <p>In this way I could easily update the primary color and not have to worry about changing every reference to it across my overrides.  I realize I could extract the <code>rgba</code> value out into a <code>const</code> and that would accomplish part of my goal, but I don't see how I could access something as useful as <code>contrastText</code> in case I choose a much lighter primary color.</p>
  
  <p>So - does anyone know of a way to reference theme palette colors in a theme override definition?  Any help would be greatly appreciated!</p>