ThemeOptions TS typings appear to be incomplete

In the documentation for themes it is suggested that you can do the following:

const theme = createMuiTheme({
  palette: {
    contrastThreshold: 3,
    tonalOffset: 0.2,
  },
  status: {
    danger: 'orange',
  },
});

But it appears that the ThemeOptions interface accepted by createMuiTheme does not have the properties status, contrastThreshold or tonalOffset. Not sure if its the docs or the typings which are incorrect.

• This is a v1.x issue (v0.x is no longer maintained).
• I have searched the issues of this repository and believe that this is not a duplicate.

Expected Behavior

Typings match what the documentation says you should be able to do

Current Behavior

Typings do not match what the documentation says you should be able to do

Your Environment

Tech	Version
Material-UI	v1.2.1
React	v16.4.0
browser	Chrome

[nagarajay]

@pelotom @Slessi - I am also stuck on this problem. I tried it as the docs say but could not get contrastThreshold and tonalOffset to work. Appreciate your help.

I think I got it to work as with the same logic, as given in docs, I changed the PaletteOptions in createPalette declaration.

import {
  Palette,
  PaletteOptions
} from "@material-ui/core/styles/createPalette";

declare module "@material-ui/core/styles/createPalette" {
  interface Palette {
    contrastThreshold: number;
    tonalOffset: number;
  }

  interface PaletteOptions {
    contrastThreshold?: number;
    tonalOffset?: number;
  }
}

If my approach is incorrect please let me know.

[Slessi]

The docs are what brought me here: https://material-ui.com/customization/themes/#createmuitheme-options-theme

This was listed as an example:

import { createMuiTheme } from '@material-ui/core/styles';
import purple from '@material-ui/core/colors/purple';
import green from '@material-ui/core/colors/green';

const theme = createMuiTheme({
  palette: {
    primary: purple,
    secondary: green,
  },
  status: {
    danger: 'orange',
  },
});

And in TS this results in:

Argument of type ‘{ palette: { primary: Color; secondary: Color; }; status: { danger: string; }; }’ is not assignable to parameter of type ‘ThemeOptions | undefined’. Object literal may only specify known properties, and ‘status’ does not exist in type ‘ThemeOptions | undefined’.