Skip to content

Commit

Permalink
[theme] Warn when palette structure is wrong
Browse files Browse the repository at this point in the history
  • Loading branch information
oliviertassinari committed Mar 23, 2020
1 parent 5a794bd commit 8c6d8f2
Showing 1 changed file with 32 additions and 11 deletions.
43 changes: 32 additions & 11 deletions packages/material-ui/src/styles/createPalette.js
Original file line number Diff line number Diff line change
Expand Up @@ -132,12 +132,6 @@ export default function createPalette(palette) {
// Bootstrap: https://github.com/twbs/bootstrap/blob/1d6e3710dd447de1a200f29e8fa521f8a0908f70/scss/_functions.scss#L59
// and material-components-web https://github.com/material-components/material-components-web/blob/ac46b8863c4dab9fc22c4c662dc6bd1b65dd652f/packages/mdc-theme/_functions.scss#L54
function getContrastText(background) {
if (!background) {
throw new TypeError(
`Material-UI: missing background argument in getContrastText(${background}).`,
);
}

const contrastText =
getContrastRatio(background, dark.text.primary) >= contrastThreshold
? dark.text.primary
Expand All @@ -159,21 +153,48 @@ export default function createPalette(palette) {
return contrastText;
}

function augmentColor(color, mainShade = 500, lightShade = 300, darkShade = 700) {
const augmentColor = (color, mainShade = 500, lightShade = 300, darkShade = 700) => {
color = { ...color };
if (!color.main && color[mainShade]) {
color.main = color[mainShade];
}

if (process.env.NODE_ENV !== 'production') {
if (!color.main) {
throw new Error(
if (!color.main) {
if (process.env.NODE_ENV !== 'production') {
console.error(
[
'Material-UI: the color provided to augmentColor(color) is invalid.',
`The color object needs to have a \`main\` property or a \`${mainShade}\` property.`,
].join('\n'),
);
}
color.main = indigo[500];
}

if (typeof color.main !== 'string') {
if (process.env.NODE_ENV !== 'production') {
console.error(
[
'Material-UI: the color provided to augmentColor(color) is invalid.',
`\`color.main\` should be a string, but \`${JSON.stringify(
color.main,
)}\` was provided instead.`,
'',
'Did you intent to do one of the followings?',
'',
'import { green } from "@material-ui/core/colors";',
'',
'const theme1 = createMuiTheme({ palette: {',
' primary: green,',
'} });',
'',
'const theme2 = createMuiTheme({ palette: {',
' primary: { main: green[500] },',
'} });',
].join('\n'),
);
}
color.main = indigo[500];
}

addLightOrDark(color, 'light', lightShade, tonalOffset);
Expand All @@ -183,7 +204,7 @@ export default function createPalette(palette) {
}

return color;
}
};

const types = { dark, light };

Expand Down

0 comments on commit 8c6d8f2

Please sign in to comment.