diff --git a/docs/src/pages/components/text-fields/text-fields.md b/docs/src/pages/components/text-fields/text-fields.md index aae440dfbb2c6c..d31eebc59c912b 100644 --- a/docs/src/pages/components/text-fields/text-fields.md +++ b/docs/src/pages/components/text-fields/text-fields.md @@ -17,7 +17,9 @@ It supports standard, outlined and filled styling. {{"demo": "pages/components/text-fields/BasicTextFields.js"}} -Note: The standard variant of the `TextField` is no longer documented in the [Material Design guidelines](https://material.io/), but Material-UI will continue to support it. +**Note:** The standard variant of the `TextField` is no longer documented in the [Material Design guidelines](https://material.io/) +([here's why](https://medium.com/google-design/the-evolution-of-material-designs-text-fields-603688b3fe03)), +but Material-UI will continue to support it. ## Form props diff --git a/docs/src/pages/styles/basics/basics.md b/docs/src/pages/styles/basics/basics.md index 4d238203303908..1c9488f51cc23a 100644 --- a/docs/src/pages/styles/basics/basics.md +++ b/docs/src/pages/styles/basics/basics.md @@ -22,6 +22,8 @@ Material-UI's styling solution is inspired by many other styling libraries such ## Installation +> `@material-ui/styles` is re-exported as `@material-ui/core/styles` - you only need to install it if you wish to use it independently from Material-UI. + To install and save in your `package.json` dependencies, run: ```sh diff --git a/packages/material-ui/src/CircularProgress/CircularProgress.js b/packages/material-ui/src/CircularProgress/CircularProgress.js index 96649b065522e5..23b75472ed4c0d 100644 --- a/packages/material-ui/src/CircularProgress/CircularProgress.js +++ b/packages/material-ui/src/CircularProgress/CircularProgress.js @@ -8,8 +8,7 @@ import capitalize from '../utils/capitalize'; const SIZE = 44; function getRelativeValue(value, min, max) { - const clampedValue = Math.min(Math.max(min, value), max); - return (clampedValue - min) / (max - min); + return (Math.min(Math.max(min, value), max) - min) / (max - min); } function easeOut(t) { diff --git a/packages/material-ui/src/NativeSelect/NativeSelectInput.js b/packages/material-ui/src/NativeSelect/NativeSelectInput.js index f55ead523aed17..c333ce5b8fee0c 100644 --- a/packages/material-ui/src/NativeSelect/NativeSelectInput.js +++ b/packages/material-ui/src/NativeSelect/NativeSelectInput.js @@ -63,7 +63,7 @@ NativeSelectInput.propTypes = { /** * The icon that displays the arrow. */ - IconComponent: PropTypes.elementType, + IconComponent: PropTypes.elementType.isRequired, /** * Use that prop to pass a ref to the native select element. * @deprecated diff --git a/packages/material-ui/src/Slider/Slider.js b/packages/material-ui/src/Slider/Slider.js index 7d5a0cce2a003c..99663febd19ee6 100644 --- a/packages/material-ui/src/Slider/Slider.js +++ b/packages/material-ui/src/Slider/Slider.js @@ -16,13 +16,7 @@ function asc(a, b) { } function clamp(value, min, max) { - if (value < min) { - return min; - } - if (value > max) { - return max; - } - return value; + return Math.min(Math.max(min, value), max); } function findClosest(values, currentValue) { diff --git a/packages/material-ui/src/styles/colorManipulator.js b/packages/material-ui/src/styles/colorManipulator.js index 522a579b4ed21f..10ec115d4baa3b 100644 --- a/packages/material-ui/src/styles/colorManipulator.js +++ b/packages/material-ui/src/styles/colorManipulator.js @@ -15,13 +15,7 @@ function clamp(value, min = 0, max = 1) { } } - if (value < min) { - return min; - } - if (value > max) { - return max; - } - return value; + return Math.min(Math.max(min, value), max); } /**