diff --git a/docs/src/app/components/AppNavDrawer.js b/docs/src/app/components/AppNavDrawer.js index dfedba950708e4..3b0e71933c7025 100644 --- a/docs/src/app/components/AppNavDrawer.js +++ b/docs/src/app/components/AppNavDrawer.js @@ -1,4 +1,4 @@ -import React from 'react'; +import React, {createClass, PropTypes} from 'react'; import Drawer from 'material-ui/Drawer'; import {List, ListItem, MakeSelectable} from 'material-ui/List'; import Divider from 'material-ui/Divider'; @@ -10,20 +10,20 @@ import {cyan500} from 'material-ui/styles/colors'; const SelectableList = MakeSelectable(List); -const AppNavDrawer = React.createClass({ +const AppNavDrawer = createClass({ propTypes: { - docked: React.PropTypes.bool.isRequired, - location: React.PropTypes.object.isRequired, - onChangeList: React.PropTypes.func.isRequired, - onRequestChangeNavDrawer: React.PropTypes.func.isRequired, - open: React.PropTypes.bool.isRequired, - style: React.PropTypes.object, + docked: PropTypes.bool.isRequired, + location: PropTypes.object.isRequired, + onChangeList: PropTypes.func.isRequired, + onRequestChangeNavDrawer: PropTypes.func.isRequired, + open: PropTypes.bool.isRequired, + style: PropTypes.object, }, contextTypes: { - muiTheme: React.PropTypes.object.isRequired, - router: React.PropTypes.object.isRequired, + muiTheme: PropTypes.object.isRequired, + router: PropTypes.object.isRequired, }, getInitialState: () => { diff --git a/docs/src/app/components/CodeExample/CodeBlock.js b/docs/src/app/components/CodeExample/CodeBlock.js index 8d74441d680acd..337c17758bcd21 100644 --- a/docs/src/app/components/CodeExample/CodeBlock.js +++ b/docs/src/app/components/CodeExample/CodeBlock.js @@ -1,4 +1,4 @@ -import React from 'react'; +import React, {createClass, PropTypes} from 'react'; import MarkdownElement from '../MarkdownElement'; import PureRenderMixin from 'react-addons-pure-render-mixin'; import transitions from 'material-ui/styles/transitions'; @@ -31,11 +31,11 @@ const styles = { }, }; -const CodeBlock = React.createClass({ +const CodeBlock = createClass({ propTypes: { - children: React.PropTypes.string, - description: React.PropTypes.string, - title: React.PropTypes.string, + children: PropTypes.string, + description: PropTypes.string, + title: PropTypes.string, }, mixins: [ PureRenderMixin, diff --git a/docs/src/app/components/CodeExample/CodeBlockTitle.js b/docs/src/app/components/CodeExample/CodeBlockTitle.js index 3de595572a638f..c662530c944883 100644 --- a/docs/src/app/components/CodeExample/CodeBlockTitle.js +++ b/docs/src/app/components/CodeExample/CodeBlockTitle.js @@ -1,4 +1,4 @@ -import React from 'react'; +import React, {PropTypes} from 'react'; import IconButton from 'material-ui/IconButton'; import CodeIcon from 'material-ui/svg-icons/action/code'; import {Toolbar, ToolbarGroup, ToolbarTitle} from 'material-ui/Toolbar'; @@ -17,8 +17,8 @@ const CodeBlockTitle = (props) => ( ); CodeBlockTitle.propTypes = { - title: React.PropTypes.string, - tooltip: React.PropTypes.string, + title: PropTypes.string, + tooltip: PropTypes.string, }; export default CodeBlockTitle; diff --git a/docs/src/app/components/CodeExample/index.js b/docs/src/app/components/CodeExample/index.js index 73ecab20c15fd2..cd15b62446c9ab 100644 --- a/docs/src/app/components/CodeExample/index.js +++ b/docs/src/app/components/CodeExample/index.js @@ -1,17 +1,17 @@ -import React from 'react'; +import React, {Component, PropTypes} from 'react'; import {parse} from 'react-docgen'; import CodeBlock from './CodeBlock'; import ClearFix from 'material-ui/internal/ClearFix'; import Paper from 'material-ui/Paper'; -class CodeExample extends React.Component { +class CodeExample extends Component { static propTypes = { - children: React.PropTypes.node, - code: React.PropTypes.string.isRequired, - component: React.PropTypes.bool, - description: React.PropTypes.string, - layoutSideBySide: React.PropTypes.bool, - title: React.PropTypes.string, + children: PropTypes.node, + code: PropTypes.string.isRequired, + component: PropTypes.bool, + description: PropTypes.string, + layoutSideBySide: PropTypes.bool, + title: PropTypes.string, }; static defaultProps = { @@ -19,7 +19,7 @@ class CodeExample extends React.Component { }; static contextTypes = { - muiTheme: React.PropTypes.object, + muiTheme: PropTypes.object, }; render() { diff --git a/docs/src/app/components/ComponentDoc.js b/docs/src/app/components/ComponentDoc.js index a9a676df17c375..b75c36648b92fa 100644 --- a/docs/src/app/components/ComponentDoc.js +++ b/docs/src/app/components/ComponentDoc.js @@ -1,22 +1,22 @@ -import React from 'react'; +import React, {createClass, PropTypes} from 'react'; import {ClearFix} from 'material-ui'; import ComponentInfo from './ComponentInfo'; import typography from 'styles/typography'; -const ComponentDoc = React.createClass({ +const ComponentDoc = createClass({ propTypes: { - children: React.PropTypes.node, - componentInfo: React.PropTypes.array.isRequired, - desc: React.PropTypes.oneOfType([ - React.PropTypes.string, - React.PropTypes.element, + children: PropTypes.node, + componentInfo: PropTypes.array.isRequired, + desc: PropTypes.oneOfType([ + PropTypes.string, + PropTypes.element, ]), - name: React.PropTypes.string.isRequired, + name: PropTypes.string.isRequired, }, contextTypes: { - muiTheme: React.PropTypes.object, + muiTheme: PropTypes.object, }, getStyles() { diff --git a/docs/src/app/components/ComponentInfo.js b/docs/src/app/components/ComponentInfo.js index 2c919995d27b6b..a388393ed48ccd 100644 --- a/docs/src/app/components/ComponentInfo.js +++ b/docs/src/app/components/ComponentInfo.js @@ -1,19 +1,19 @@ -import React from 'react'; +import React, {createClass, PropTypes} from 'react'; import {Mixins, Styles} from 'material-ui'; const {StyleResizable} = Mixins; const {typography, spacing} = Styles; -const ComponentInfo = React.createClass({ +const ComponentInfo = createClass({ propTypes: { - infoArray: React.PropTypes.array.isRequired, - name: React.PropTypes.string.isRequired, - style: React.PropTypes.object, + infoArray: PropTypes.array.isRequired, + name: PropTypes.string.isRequired, + style: PropTypes.object, }, contextTypes: { - muiTheme: React.PropTypes.object, + muiTheme: PropTypes.object, }, mixins: [StyleResizable], diff --git a/docs/src/app/components/FullWidthSection.js b/docs/src/app/components/FullWidthSection.js index c2b35f928ce740..52b31dc345ff69 100644 --- a/docs/src/app/components/FullWidthSection.js +++ b/docs/src/app/components/FullWidthSection.js @@ -1,17 +1,17 @@ -import React from 'react'; +import React, {createClass, PropTypes} from 'react'; import ClearFix from 'material-ui/internal/ClearFix'; import spacing from 'material-ui/styles/spacing'; import styleResizable from 'material-ui/utils/styleResizable'; const desktopGutter = spacing.desktopGutter; -const FullWidthSection = React.createClass({ +const FullWidthSection = createClass({ propTypes: { - children: React.PropTypes.node, - contentStyle: React.PropTypes.object, - contentType: React.PropTypes.string, - style: React.PropTypes.object, - useContent: React.PropTypes.bool, + children: PropTypes.node, + contentStyle: PropTypes.object, + contentType: PropTypes.string, + style: PropTypes.object, + useContent: PropTypes.bool, }, mixins: [ diff --git a/docs/src/app/components/MarkdownElement.js b/docs/src/app/components/MarkdownElement.js index fc74571524be74..0a9603cfe8cb86 100644 --- a/docs/src/app/components/MarkdownElement.js +++ b/docs/src/app/components/MarkdownElement.js @@ -1,4 +1,4 @@ -import React from 'react'; +import React, {createClass, PropTypes} from 'react'; import marked from 'marked'; import PureRenderMixin from 'react-addons-pure-render-mixin'; @@ -12,10 +12,10 @@ const styles = { }, }; -const MarkdownElement = React.createClass({ +const MarkdownElement = createClass({ propTypes: { - style: React.PropTypes.object, - text: React.PropTypes.string, + style: PropTypes.object, + text: PropTypes.string, }, mixins: [ PureRenderMixin, diff --git a/docs/src/app/components/Master.js b/docs/src/app/components/Master.js index 87e421849584f9..71d4abb1b43f93 100644 --- a/docs/src/app/components/Master.js +++ b/docs/src/app/components/Master.js @@ -1,4 +1,4 @@ -import React from 'react'; +import React, {createClass, PropTypes} from 'react'; import Title from 'react-title-component'; import AppBar from 'material-ui/AppBar'; import IconButton from 'material-ui/IconButton'; @@ -17,19 +17,19 @@ const githubButton = ( /> ); -const Master = React.createClass({ +const Master = createClass({ propTypes: { - children: React.PropTypes.node, - location: React.PropTypes.object, + children: PropTypes.node, + location: PropTypes.object, }, contextTypes: { - router: React.PropTypes.object.isRequired, + router: PropTypes.object.isRequired, }, childContextTypes: { - muiTheme: React.PropTypes.object, + muiTheme: PropTypes.object, }, mixins: [ diff --git a/docs/src/app/components/MobileTearSheet.js b/docs/src/app/components/MobileTearSheet.js index 54181cbdb53020..5bf0793edd9726 100644 --- a/docs/src/app/components/MobileTearSheet.js +++ b/docs/src/app/components/MobileTearSheet.js @@ -1,14 +1,14 @@ -import React from 'react'; +import React, {createClass, PropTypes} from 'react'; -const MobileTearSheet = React.createClass({ +const MobileTearSheet = createClass({ propTypes: { - children: React.PropTypes.node, - height: React.PropTypes.number, + children: PropTypes.node, + height: PropTypes.number, }, contextTypes: { - muiTheme: React.PropTypes.object, + muiTheme: PropTypes.object, }, getDefaultProps() { diff --git a/docs/src/app/components/PropTypeDescription.js b/docs/src/app/components/PropTypeDescription.js index 3bcac6d1c189ce..ec78a71bdc69d0 100644 --- a/docs/src/app/components/PropTypeDescription.js +++ b/docs/src/app/components/PropTypeDescription.js @@ -1,4 +1,4 @@ -import React from 'react'; +import React, {createClass, PropTypes} from 'react'; import {parse} from 'react-docgen'; import {parse as parseDoctrine} from 'doctrine'; import PureRenderMixin from 'react-addons-pure-render-mixin'; @@ -8,7 +8,7 @@ import recast from 'recast'; require('./prop-type-description.css'); function getDeprecatedInfo(type) { - const deprecatedPropType = 'deprecated(React.PropTypes.'; + const deprecatedPropType = 'deprecated(PropTypes.'; const indexStart = type.raw.indexOf(deprecatedPropType); @@ -101,10 +101,10 @@ function generateDescription(required, description, type) { return `${deprecated} ${jsDocText}${signature}`; } -const PropTypeDescription = React.createClass({ +const PropTypeDescription = createClass({ propTypes: { - code: React.PropTypes.string, - header: React.PropTypes.string, + code: PropTypes.string, + header: PropTypes.string, }, mixins: [ PureRenderMixin, diff --git a/docs/src/app/components/pages/Home.js b/docs/src/app/components/pages/Home.js index 3a6bd567eb15d0..9cb114587d8979 100644 --- a/docs/src/app/components/pages/Home.js +++ b/docs/src/app/components/pages/Home.js @@ -1,4 +1,4 @@ -import React from 'react'; +import React, {createClass, PropTypes} from 'react'; import HomeFeature from './HomeFeature'; import FullWidthSection from '../FullWidthSection'; import RaisedButton from 'material-ui/RaisedButton'; @@ -8,10 +8,10 @@ import typography from 'material-ui/styles/typography'; import lightBaseTheme from 'material-ui/styles/baseThemes/lightBaseTheme'; import {cyan500, grey200, darkWhite} from 'material-ui/styles/colors'; -const HomePage = React.createClass({ +const HomePage = createClass({ contextTypes: { - router: React.PropTypes.object.isRequired, + router: PropTypes.object.isRequired, }, mixins: [ diff --git a/docs/src/app/components/pages/HomeFeature.js b/docs/src/app/components/pages/HomeFeature.js index 94b733f947def4..f029da56f2b74b 100644 --- a/docs/src/app/components/pages/HomeFeature.js +++ b/docs/src/app/components/pages/HomeFeature.js @@ -1,4 +1,4 @@ -import React from 'react'; +import React, {createClass, PropTypes} from 'react'; import {Link} from 'react-router'; import styleResizable from 'material-ui/utils/styleResizable'; import spacing from 'material-ui/styles/spacing'; @@ -7,14 +7,14 @@ import typography from 'material-ui/styles/typography'; import {grey200} from 'material-ui/styles/colors'; import Paper from 'material-ui/Paper'; -const HomeFeature = React.createClass({ +const HomeFeature = createClass({ propTypes: { - firstChild: React.PropTypes.bool, - heading: React.PropTypes.string, - img: React.PropTypes.string, - lastChild: React.PropTypes.bool, - route: React.PropTypes.string, + firstChild: PropTypes.bool, + heading: PropTypes.string, + img: PropTypes.string, + lastChild: PropTypes.bool, + route: PropTypes.string, }, mixins: [styleResizable], diff --git a/docs/src/app/components/pages/components/List/ExampleSelectable.js b/docs/src/app/components/pages/components/List/ExampleSelectable.js index d68df28a7d7a62..bbb939f8db0ffd 100644 --- a/docs/src/app/components/pages/components/List/ExampleSelectable.js +++ b/docs/src/app/components/pages/components/List/ExampleSelectable.js @@ -1,4 +1,4 @@ -import React from 'react'; +import React, {Component, PropTypes} from 'react'; import MobileTearSheet from '../../../MobileTearSheet'; import {List, ListItem, MakeSelectable} from 'material-ui/List'; import Avatar from 'material-ui/Avatar'; @@ -7,10 +7,10 @@ import Subheader from 'material-ui/Subheader'; let SelectableList = MakeSelectable(List); function wrapState(ComposedComponent) { - return class SelectableList extends React.Component { + return class SelectableList extends Component { static propTypes = { - children: React.PropTypes.node.isRequired, - defaultValue: React.PropTypes.number.isRequired, + children: PropTypes.node.isRequired, + defaultValue: PropTypes.number.isRequired, }; componentWillMount() { diff --git a/docs/src/app/components/pages/customization/Colors.js b/docs/src/app/components/pages/customization/Colors.js index d1aa55851b7777..77e9fd5ff8a7e3 100644 --- a/docs/src/app/components/pages/customization/Colors.js +++ b/docs/src/app/components/pages/customization/Colors.js @@ -1,4 +1,4 @@ -import React from 'react'; +import React, {createClass} from 'react'; import Title from 'react-title-component'; import styleResizable from 'material-ui/utils/styleResizable'; import ClearFix from 'material-ui/internal/ClearFix'; @@ -6,7 +6,7 @@ import {getContrastRatio} from 'material-ui/utils/colorManipulator'; import typography from 'material-ui/styles/typography'; import * as colors from 'material-ui/styles/colors'; -const ColorsPage = React.createClass({ +const ColorsPage = createClass({ mixins: [ styleResizable, diff --git a/docs/src/app/components/pages/customization/Themes.js b/docs/src/app/components/pages/customization/Themes.js index 84d82c672ef036..94153ad5fcb836 100644 --- a/docs/src/app/components/pages/customization/Themes.js +++ b/docs/src/app/components/pages/customization/Themes.js @@ -1,4 +1,4 @@ -import React from 'react'; +import React, {createClass, PropTypes} from 'react'; import Title from 'react-title-component'; import MarkdownElement from '../../MarkdownElement'; import muiThemeable from 'material-ui/styles/muiThemeable'; @@ -39,11 +39,11 @@ You can use the tabs to change the theme. The changes will be applied to the who documentation. `; -const ThemesPage = React.createClass({ +const ThemesPage = createClass({ propTypes: { - muiTheme: React.PropTypes.object, - onChangeMuiTheme: React.PropTypes.func, + muiTheme: PropTypes.object, + onChangeMuiTheme: PropTypes.func, }, mixins: [styleResizable], diff --git a/docs/src/app/components/pages/customization/themes.md b/docs/src/app/components/pages/customization/themes.md index bad5a383d86dd5..d31cf1deceab2b 100644 --- a/docs/src/app/components/pages/customization/themes.md +++ b/docs/src/app/components/pages/customization/themes.md @@ -113,7 +113,7 @@ class DeepDownTheTree extends React.Component { } DeepDownTheTree.propTypes = { - muiTheme: React.PropTypes.object.isRequired, + muiTheme: PropTypes.object.isRequired, }; export default muiThemeable()(DeepDownTheTree); @@ -145,7 +145,7 @@ class Main extends React.Component { } Main.childContextTypes = { - muiTheme: React.PropTypes.object.isRequired, + muiTheme: PropTypes.object.isRequired, }; export default Main; @@ -167,7 +167,7 @@ class DeepDownTheTree extends React.Component { } DeepDownTheTree.contextTypes = { - muiTheme: React.PropTypes.object.isRequired, + muiTheme: PropTypes.object.isRequired, }; export default DeepDownTheTree; diff --git a/src/AppBar/AppBar.js b/src/AppBar/AppBar.js index 504c023abda311..6289ab4db50f2a 100644 --- a/src/AppBar/AppBar.js +++ b/src/AppBar/AppBar.js @@ -1,4 +1,4 @@ -import React from 'react'; +import React, {Component, PropTypes} from 'react'; import IconButton from '../IconButton'; import NavigationMenu from '../svg-icons/navigation/menu'; import Paper from '../Paper'; @@ -61,89 +61,89 @@ function getStyles(props, context) { return styles; } -class AppBar extends React.Component { +class AppBar extends Component { static muiName = 'AppBar'; static propTypes = { /** * Can be used to render a tab inside an app bar for instance. */ - children: React.PropTypes.node, + children: PropTypes.node, /** * Applied to the app bar's root element. */ - className: React.PropTypes.string, + className: PropTypes.string, /** * The classname of the icon on the left of the app bar. * If you are using a stylesheet for your icons, enter the class name for the icon to be used here. */ - iconClassNameLeft: React.PropTypes.string, + iconClassNameLeft: PropTypes.string, /** * Similiar to the iconClassNameLeft prop except that * it applies to the icon displayed on the right of the app bar. */ - iconClassNameRight: React.PropTypes.string, + iconClassNameRight: PropTypes.string, /** * The custom element to be displayed on the left side of the * app bar such as an SvgIcon. */ - iconElementLeft: React.PropTypes.element, + iconElementLeft: PropTypes.element, /** * Similiar to the iconElementLeft prop except that this element is displayed on the right of the app bar. */ - iconElementRight: React.PropTypes.element, + iconElementRight: PropTypes.element, /** * Override the inline-styles of the element displayed on the right side of the app bar. */ - iconStyleRight: React.PropTypes.object, + iconStyleRight: PropTypes.object, /** * Callback function for when the left icon is selected via a touch tap. * * @param {object} event TouchTap event targeting the left `IconButton`. */ - onLeftIconButtonTouchTap: React.PropTypes.func, + onLeftIconButtonTouchTap: PropTypes.func, /** * Callback function for when the right icon is selected via a touch tap. * * @param {object} event TouchTap event targeting the right `IconButton`. */ - onRightIconButtonTouchTap: React.PropTypes.func, + onRightIconButtonTouchTap: PropTypes.func, /** * Callback function for when the title text is selected via a touch tap. * * @param {object} event TouchTap event targeting the `title` node. */ - onTitleTouchTap: React.PropTypes.func, + onTitleTouchTap: PropTypes.func, /** * Determines whether or not to display the Menu icon next to the title. * Setting this prop to false will hide the icon. */ - showMenuIconButton: React.PropTypes.bool, + showMenuIconButton: PropTypes.bool, /** * Override the inline-styles of the root element. */ - style: React.PropTypes.object, + style: PropTypes.object, /** * The title to display on the app bar. */ - title: React.PropTypes.node, + title: PropTypes.node, /** * Override the inline-styles of the app bar's title element. */ - titleStyle: React.PropTypes.object, + titleStyle: PropTypes.object, /** * The zDepth of the component. @@ -159,7 +159,7 @@ class AppBar extends React.Component { }; static contextTypes = { - muiTheme: React.PropTypes.object.isRequired, + muiTheme: PropTypes.object.isRequired, }; componentDidMount() { diff --git a/src/AutoComplete/AutoComplete.js b/src/AutoComplete/AutoComplete.js index 278caa039e8730..1ce75a0d1533fe 100644 --- a/src/AutoComplete/AutoComplete.js +++ b/src/AutoComplete/AutoComplete.js @@ -1,4 +1,4 @@ -import React from 'react'; +import React, {Component, PropTypes} from 'react'; import ReactDOM from 'react-dom'; import keycode from 'keycode'; import TextField from '../TextField'; @@ -41,7 +41,7 @@ function getStyles(props, context, state) { return styles; } -class AutoComplete extends React.Component { +class AutoComplete extends Component { static propTypes = { /** * Location of the anchor for the auto complete. @@ -51,27 +51,27 @@ class AutoComplete extends React.Component { /** * If true, the auto complete is animated as it is toggled. */ - animated: React.PropTypes.bool, + animated: PropTypes.bool, /** * Array of strings or nodes used to populate the list. */ - dataSource: React.PropTypes.array.isRequired, + dataSource: PropTypes.array.isRequired, /** * Disables focus ripple when true. */ - disableFocusRipple: React.PropTypes.bool, + disableFocusRipple: PropTypes.bool, /** * Override style prop for error. */ - errorStyle: React.PropTypes.object, + errorStyle: PropTypes.object, /** * The error content to display. */ - errorText: React.PropTypes.node, + errorText: PropTypes.node, /** * Callback function used to filter the auto complete. @@ -80,67 +80,67 @@ class AutoComplete extends React.Component { * @param {string} key `dataSource` element, or `text` property on that element if it's not a string. * @returns {boolean} `true` indicates the auto complete list will include `key` when the input is `searchText`. */ - filter: React.PropTypes.func, + filter: PropTypes.func, /** * The content to use for adding floating label element. */ - floatingLabelText: React.PropTypes.node, + floatingLabelText: PropTypes.node, /** * If true, the field receives the property `width: 100%`. */ - fullWidth: React.PropTypes.bool, + fullWidth: PropTypes.bool, /** * The hint content to display. */ - hintText: React.PropTypes.node, + hintText: PropTypes.node, /** * Override style for list. */ - listStyle: React.PropTypes.object, + listStyle: PropTypes.object, /** * The max number of search results to be shown. * By default it shows all the items which matches filter. */ - maxSearchResults: React.PropTypes.number, + maxSearchResults: PropTypes.number, /** * Delay for closing time of the menu. */ - menuCloseDelay: React.PropTypes.number, + menuCloseDelay: PropTypes.number, /** * Props to be passed to menu. */ - menuProps: React.PropTypes.object, + menuProps: PropTypes.object, /** * Override style for menu. */ - menuStyle: React.PropTypes.object, + menuStyle: PropTypes.object, /** * Callback function that is fired when the `TextField` loses focus. * * @param {object} event `blur` event targeting the `TextField`. */ - onBlur: React.PropTypes.func, + onBlur: PropTypes.func, /** * Callback function that is fired when the `TextField` gains focus. * * @param {object} event `focus` event targeting the `TextField`. */ - onFocus: React.PropTypes.func, + onFocus: PropTypes.func, /** * Callback function that is fired when the `TextField` receives a keydown event. */ - onKeyDown: React.PropTypes.func, + onKeyDown: PropTypes.func, /** * Callback function that is fired when a list item is selected, or enter is pressed in the `TextField`. @@ -150,7 +150,7 @@ class AutoComplete extends React.Component { * @param {number} index The index in `dataSource` of the list item selected, or `-1` if enter is pressed in the * `TextField`. */ - onNewRequest: React.PropTypes.func, + onNewRequest: PropTypes.func, /** * Callback function that is fired when the user updates the `TextField`. @@ -158,27 +158,27 @@ class AutoComplete extends React.Component { * @param {string} searchText The auto-complete's `searchText` value. * @param {array} dataSource The auto-complete's `dataSource` array. */ - onUpdateInput: React.PropTypes.func, + onUpdateInput: PropTypes.func, /** * Auto complete menu is open if true. */ - open: React.PropTypes.bool, + open: PropTypes.bool, /** * If true, the list item is showed when a focus event triggers. */ - openOnFocus: React.PropTypes.bool, + openOnFocus: PropTypes.bool, /** * Text being input to auto complete. */ - searchText: React.PropTypes.string, + searchText: PropTypes.string, /** * Override the inline-styles of the root element. */ - style: React.PropTypes.object, + style: PropTypes.object, /** * Origin for location of target. @@ -188,7 +188,7 @@ class AutoComplete extends React.Component { /** * If true, will update when focus event triggers. */ - triggerUpdateOnFocus: deprecated(React.PropTypes.bool, 'Instead, use openOnFocus'), + triggerUpdateOnFocus: deprecated(PropTypes.bool, 'Instead, use openOnFocus'), }; static defaultProps = { @@ -213,7 +213,7 @@ class AutoComplete extends React.Component { }; static contextTypes = { - muiTheme: React.PropTypes.object.isRequired, + muiTheme: PropTypes.object.isRequired, }; state = { diff --git a/src/Avatar/Avatar.js b/src/Avatar/Avatar.js index ea71c566c8f6bf..8f8ca801f00cc8 100644 --- a/src/Avatar/Avatar.js +++ b/src/Avatar/Avatar.js @@ -1,4 +1,4 @@ -import React from 'react'; +import React, {Component, PropTypes} from 'react'; function getStyles(props, context) { const { @@ -43,47 +43,47 @@ function getStyles(props, context) { return styles; } -class Avatar extends React.Component { +class Avatar extends Component { static propTypes = { /** * The backgroundColor of the avatar. Does not apply to image avatars. */ - backgroundColor: React.PropTypes.string, + backgroundColor: PropTypes.string, /** * Can be used, for instance, to render a letter inside the avatar. */ - children: React.PropTypes.node, + children: PropTypes.node, /** * The css class name of the root `div` or `img` element. */ - className: React.PropTypes.string, + className: PropTypes.string, /** * The icon or letter's color. */ - color: React.PropTypes.string, + color: PropTypes.string, /** * This is the SvgIcon or FontIcon to be used inside the avatar. */ - icon: React.PropTypes.element, + icon: PropTypes.element, /** * This is the size of the avatar in pixels. */ - size: React.PropTypes.number, + size: PropTypes.number, /** * If passed in, this component will render an img element. Otherwise, a div will be rendered. */ - src: React.PropTypes.string, + src: PropTypes.string, /** * Override the inline-styles of the root element. */ - style: React.PropTypes.object, + style: PropTypes.object, }; static defaultProps = { @@ -91,7 +91,7 @@ class Avatar extends React.Component { }; static contextTypes = { - muiTheme: React.PropTypes.object.isRequired, + muiTheme: PropTypes.object.isRequired, }; render() { diff --git a/src/Badge/Badge.js b/src/Badge/Badge.js index cae384f4336c6e..ae5ebe93193f37 100644 --- a/src/Badge/Badge.js +++ b/src/Badge/Badge.js @@ -1,4 +1,4 @@ -import React from 'react'; +import React, {Component, PropTypes} from 'react'; function getStyles(props, context) { const {primary, secondary} = props; @@ -48,42 +48,42 @@ function getStyles(props, context) { }; } -class Badge extends React.Component { +class Badge extends Component { static propTypes = { /** * This is the content rendered within the badge. */ - badgeContent: React.PropTypes.node.isRequired, + badgeContent: PropTypes.node.isRequired, /** * Override the inline-styles of the badge element. */ - badgeStyle: React.PropTypes.object, + badgeStyle: PropTypes.object, /** * The badge will be added relativelty to this node. */ - children: React.PropTypes.node, + children: PropTypes.node, /** * The css class name of the root element. */ - className: React.PropTypes.string, + className: PropTypes.string, /** * If true, the badge will use the primary badge colors. */ - primary: React.PropTypes.bool, + primary: PropTypes.bool, /** * If true, the badge will use the secondary badge colors. */ - secondary: React.PropTypes.bool, + secondary: PropTypes.bool, /** * Override the inline-styles of the root element. */ - style: React.PropTypes.object, + style: PropTypes.object, }; static defaultProps = { @@ -92,7 +92,7 @@ class Badge extends React.Component { }; static contextTypes = { - muiTheme: React.PropTypes.object.isRequired, + muiTheme: PropTypes.object.isRequired, }; render() { diff --git a/src/Card/Card.js b/src/Card/Card.js index 8676aaea533da3..48e4f6a09ed7f0 100644 --- a/src/Card/Card.js +++ b/src/Card/Card.js @@ -1,42 +1,42 @@ -import React from 'react'; +import React, {Component, PropTypes} from 'react'; import Paper from '../Paper'; import CardExpandable from './CardExpandable'; -class Card extends React.Component { +class Card extends Component { static propTypes = { /** * If true, a click on this card component expands the card. Can be set on any child of the `Card` component. */ - actAsExpander: React.PropTypes.bool, + actAsExpander: PropTypes.bool, /** * Can be used to render elements inside the Card. */ - children: React.PropTypes.node, + children: PropTypes.node, /** * If true, this card component is expandable. Can be set on any child of the `Card` component. */ - expandable: React.PropTypes.bool, + expandable: PropTypes.bool, /** * Whether this card is expanded. * If `true` or `false` the component is controlled. * if `null` the component is uncontrolled. */ - expanded: React.PropTypes.bool, + expanded: PropTypes.bool, /** * Whether this card is initially expanded. */ - initiallyExpanded: React.PropTypes.bool, + initiallyExpanded: PropTypes.bool, /** * Callback function fired when the `expandable` state of the card has changed. * * @param {boolean} newExpandedState Represents the new `expanded` state of the card. */ - onExpandChange: React.PropTypes.func, + onExpandChange: PropTypes.func, /** * If true, this card component will include a button to expand the card. `CardTitle`, @@ -44,12 +44,12 @@ class Card extends React.Component { * of `Card` can implements `showExpandableButton` or forwards the property to a child * component supporting it. */ - showExpandableButton: React.PropTypes.bool, + showExpandableButton: PropTypes.bool, /** * Override the inline-styles of the root element. */ - style: React.PropTypes.object, + style: PropTypes.object, }; static defaultProps = { diff --git a/src/Card/CardActions.js b/src/Card/CardActions.js index 78f60c49ad7655..6fd6984062cb94 100644 --- a/src/Card/CardActions.js +++ b/src/Card/CardActions.js @@ -1,4 +1,4 @@ -import React from 'react'; +import React, {Component, PropTypes} from 'react'; function getStyles() { return { @@ -12,36 +12,36 @@ function getStyles() { }; } -class CardActions extends React.Component { +class CardActions extends Component { static propTypes = { /** * If true, a click on this card component expands the card. */ - actAsExpander: React.PropTypes.bool, + actAsExpander: PropTypes.bool, /** * Can be used to render elements inside the Card Action. */ - children: React.PropTypes.node, + children: PropTypes.node, /** * If true, this card component is expandable. */ - expandable: React.PropTypes.bool, + expandable: PropTypes.bool, /** * If true, this card component will include a button to expand the card. */ - showExpandableButton: React.PropTypes.bool, + showExpandableButton: PropTypes.bool, /** * Override the inline-styles of the root element. */ - style: React.PropTypes.object, + style: PropTypes.object, }; static contextTypes = { - muiTheme: React.PropTypes.object.isRequired, + muiTheme: PropTypes.object.isRequired, }; render() { diff --git a/src/Card/CardExpandable.js b/src/Card/CardExpandable.js index c4d420d5a2dd5c..fbde64d62ae43d 100644 --- a/src/Card/CardExpandable.js +++ b/src/Card/CardExpandable.js @@ -1,4 +1,4 @@ -import React from 'react'; +import React, {Component, PropTypes} from 'react'; import OpenIcon from '../svg-icons/hardware/keyboard-arrow-up'; import CloseIcon from '../svg-icons/hardware/keyboard-arrow-down'; import IconButton from '../IconButton'; @@ -15,15 +15,15 @@ function getStyles() { }; } -class CardExpandable extends React.Component { +class CardExpandable extends Component { static propTypes = { - expanded: React.PropTypes.bool, - onExpanding: React.PropTypes.func.isRequired, - style: React.PropTypes.object, + expanded: PropTypes.bool, + onExpanding: PropTypes.func.isRequired, + style: PropTypes.object, }; static contextTypes = { - muiTheme: React.PropTypes.object.isRequired, + muiTheme: PropTypes.object.isRequired, }; render() { diff --git a/src/Card/CardHeader.js b/src/Card/CardHeader.js index 68bae1a3e1cf0b..26b83e46a78c77 100644 --- a/src/Card/CardHeader.js +++ b/src/Card/CardHeader.js @@ -1,4 +1,4 @@ -import React from 'react'; +import React, {Component, PropTypes} from 'react'; import Avatar from '../Avatar'; function getStyles(props, context) { @@ -34,74 +34,74 @@ function getStyles(props, context) { }; } -class CardHeader extends React.Component { +class CardHeader extends Component { static muiName = 'CardHeader'; static propTypes = { /** * If true, a click on this card component expands the card. */ - actAsExpander: React.PropTypes.bool, + actAsExpander: PropTypes.bool, /** * This is the [Avatar](/#/components/avatar) element to be displayed on the Card Header. */ - avatar: React.PropTypes.node, + avatar: PropTypes.node, /** * Can be used to render elements inside the Card Header. */ - children: React.PropTypes.node, + children: PropTypes.node, /** * If true, this card component is expandable. */ - expandable: React.PropTypes.bool, + expandable: PropTypes.bool, /** * If true, this card component will include a button to expand the card. */ - showExpandableButton: React.PropTypes.bool, + showExpandableButton: PropTypes.bool, /** * Override the inline-styles of the root element. */ - style: React.PropTypes.object, + style: PropTypes.object, /** * Can be used to render a subtitle in Card Header. */ - subtitle: React.PropTypes.node, + subtitle: PropTypes.node, /** * Override the subtitle color. */ - subtitleColor: React.PropTypes.string, + subtitleColor: PropTypes.string, /** * Override the inline-styles of the subtitle. */ - subtitleStyle: React.PropTypes.object, + subtitleStyle: PropTypes.object, /** * Override the inline-styles of the text. */ - textStyle: React.PropTypes.object, + textStyle: PropTypes.object, /** * Can be used to render a title in Card Header. */ - title: React.PropTypes.node, + title: PropTypes.node, /** * Override the title color. */ - titleColor: React.PropTypes.string, + titleColor: PropTypes.string, /** * Override the inline-styles of the title. */ - titleStyle: React.PropTypes.object, + titleStyle: PropTypes.object, }; static defaultProps = { @@ -109,7 +109,7 @@ class CardHeader extends React.Component { }; static contextTypes = { - muiTheme: React.PropTypes.object.isRequired, + muiTheme: PropTypes.object.isRequired, }; render() { diff --git a/src/Card/CardMedia.js b/src/Card/CardMedia.js index 45d54bf8ba0c0e..14bbd9a9c7d704 100644 --- a/src/Card/CardMedia.js +++ b/src/Card/CardMedia.js @@ -1,4 +1,4 @@ -import React from 'react'; +import React, {Component, PropTypes} from 'react'; function getStyles(props, context) { const {cardMedia} = context.muiTheme; @@ -36,56 +36,56 @@ function getStyles(props, context) { }; } -class CardMedia extends React.Component { +class CardMedia extends Component { static propTypes = { /** * If true, a click on this card component expands the card. */ - actAsExpander: React.PropTypes.bool, + actAsExpander: PropTypes.bool, /** * Can be used to render elements inside the Card Media. */ - children: React.PropTypes.node, + children: PropTypes.node, /** * If true, this card component is expandable. */ - expandable: React.PropTypes.bool, + expandable: PropTypes.bool, /** * Override the inline-styles of the Card Media. */ - mediaStyle: React.PropTypes.object, + mediaStyle: PropTypes.object, /** * Can be used to render overlay element in Card Media. */ - overlay: React.PropTypes.node, + overlay: PropTypes.node, /** * Override the inline-styles of the overlay container. */ - overlayContainerStyle: React.PropTypes.object, + overlayContainerStyle: PropTypes.object, /** * Override the inline-styles of the overlay content. */ - overlayContentStyle: React.PropTypes.object, + overlayContentStyle: PropTypes.object, /** * Override the inline-styles of the overlay element. */ - overlayStyle: React.PropTypes.object, + overlayStyle: PropTypes.object, /** * Override the inline-styles of the root element. */ - style: React.PropTypes.object, + style: PropTypes.object, }; static contextTypes = { - muiTheme: React.PropTypes.object.isRequired, + muiTheme: PropTypes.object.isRequired, }; render() { diff --git a/src/Card/CardText.js b/src/Card/CardText.js index 433a273a2fe511..b1a82e2214d85b 100644 --- a/src/Card/CardText.js +++ b/src/Card/CardText.js @@ -1,4 +1,4 @@ -import React from 'react'; +import React, {Component, PropTypes} from 'react'; function getStyles(props, context) { const {cardText} = context.muiTheme; @@ -12,38 +12,38 @@ function getStyles(props, context) { }; } -class CardText extends React.Component { +class CardText extends Component { static muiName = 'CardText'; static propTypes = { /** * If true, a click on this card component expands the card. */ - actAsExpander: React.PropTypes.bool, + actAsExpander: PropTypes.bool, /** * Can be used to render elements inside the Card Text. */ - children: React.PropTypes.node, + children: PropTypes.node, /** * Override the CardText color. */ - color: React.PropTypes.string, + color: PropTypes.string, /** * If true, this card component is expandable. */ - expandable: React.PropTypes.bool, + expandable: PropTypes.bool, /** * Override the inline-styles of the root element. */ - style: React.PropTypes.object, + style: PropTypes.object, }; static contextTypes = { - muiTheme: React.PropTypes.object.isRequired, + muiTheme: PropTypes.object.isRequired, }; render() { diff --git a/src/Card/CardTitle.js b/src/Card/CardTitle.js index 6cec939da497fd..de24295360dae0 100644 --- a/src/Card/CardTitle.js +++ b/src/Card/CardTitle.js @@ -1,4 +1,4 @@ -import React from 'react'; +import React, {Component, PropTypes} from 'react'; function getStyles(props, context) { const {card} = context.muiTheme; @@ -22,68 +22,68 @@ function getStyles(props, context) { }; } -class CardTitle extends React.Component { +class CardTitle extends Component { static muiName = 'CardTitle'; static propTypes = { /** * If true, a click on this card component expands the card. */ - actAsExpander: React.PropTypes.bool, + actAsExpander: PropTypes.bool, /** * Can be used to render elements inside the Card Title. */ - children: React.PropTypes.node, + children: PropTypes.node, /** * If true, this card component is expandable. */ - expandable: React.PropTypes.bool, + expandable: PropTypes.bool, /** * If true, this card component will include a button to expand the card. */ - showExpandableButton: React.PropTypes.bool, + showExpandableButton: PropTypes.bool, /** * Override the inline-styles of the root element. */ - style: React.PropTypes.object, + style: PropTypes.object, /** * Can be used to render a subtitle in the Card Title. */ - subtitle: React.PropTypes.node, + subtitle: PropTypes.node, /** * Override the subtitle color. */ - subtitleColor: React.PropTypes.string, + subtitleColor: PropTypes.string, /** * Override the inline-styles of the subtitle. */ - subtitleStyle: React.PropTypes.object, + subtitleStyle: PropTypes.object, /** * Can be used to render a title in the Card Title. */ - title: React.PropTypes.node, + title: PropTypes.node, /** * Override the title color. */ - titleColor: React.PropTypes.string, + titleColor: PropTypes.string, /** * Override the inline-styles of the title. */ - titleStyle: React.PropTypes.object, + titleStyle: PropTypes.object, }; static contextTypes = { - muiTheme: React.PropTypes.object.isRequired, + muiTheme: PropTypes.object.isRequired, }; render() { diff --git a/src/Checkbox/Checkbox.js b/src/Checkbox/Checkbox.js index a29cd1ced6cf18..06cc6a69df3050 100644 --- a/src/Checkbox/Checkbox.js +++ b/src/Checkbox/Checkbox.js @@ -1,4 +1,4 @@ -import React from 'react'; +import React, {Component, PropTypes} from 'react'; import EnhancedSwitch from '../internal/EnhancedSwitch'; import transitions from '../styles/transitions'; import CheckboxOutline from '../svg-icons/toggle/check-box-outline-blank'; @@ -53,18 +53,18 @@ function getStyles(props, context) { }; } -class Checkbox extends React.Component { +class Checkbox extends Component { static propTypes = { /** * Checkbox is checked if true. */ - checked: React.PropTypes.bool, + checked: PropTypes.bool, /** * The SvgIcon to use for the checked state. * This is useful to create icon toggles. */ - checkedIcon: React.PropTypes.element, + checkedIcon: PropTypes.element, /** * The default state of our checkbox component. @@ -72,32 +72,32 @@ class Checkbox extends React.Component { * Decide between using a controlled or uncontrolled input element and remove one of these props. * More info: https://fb.me/react-controlled-components */ - defaultChecked: React.PropTypes.bool, + defaultChecked: PropTypes.bool, /** * Disabled if true. */ - disabled: React.PropTypes.bool, + disabled: PropTypes.bool, /** * Overrides the inline-styles of the icon element. */ - iconStyle: React.PropTypes.object, + iconStyle: PropTypes.object, /** * Overrides the inline-styles of the input element. */ - inputStyle: React.PropTypes.object, + inputStyle: PropTypes.object, /** * Where the label will be placed next to the checkbox. */ - labelPosition: React.PropTypes.oneOf(['left', 'right']), + labelPosition: PropTypes.oneOf(['left', 'right']), /** * Overrides the inline-styles of the Checkbox element label. */ - labelStyle: React.PropTypes.object, + labelStyle: PropTypes.object, /** * Callback function that is fired when the checkbox is checked. @@ -105,30 +105,30 @@ class Checkbox extends React.Component { * @param {object} event `change` event targeting the underlying checkbox `input`. * @param {boolean} isInputChecked The `checked` value of the underlying checkbox `input`. */ - onCheck: React.PropTypes.func, + onCheck: PropTypes.func, /** * Override the inline-styles of the root element. */ - style: React.PropTypes.object, + style: PropTypes.object, /** * The SvgIcon to use for the unchecked state. * This is useful to create icon toggles. */ - unCheckedIcon: deprecated(React.PropTypes.element, + unCheckedIcon: deprecated(PropTypes.element, 'Use uncheckedIcon instead.'), /** * The SvgIcon to use for the unchecked state. * This is useful to create icon toggles. */ - uncheckedIcon: React.PropTypes.element, + uncheckedIcon: PropTypes.element, /** * ValueLink for when using controlled checkbox. */ - valueLink: React.PropTypes.object, + valueLink: PropTypes.object, }; static defaultProps = { @@ -137,7 +137,7 @@ class Checkbox extends React.Component { }; static contextTypes = { - muiTheme: React.PropTypes.object.isRequired, + muiTheme: PropTypes.object.isRequired, }; state = {switched: false}; diff --git a/src/CircularProgress/CircularProgress.js b/src/CircularProgress/CircularProgress.js index 9f5e58e1a2c946..6ac85f56d83da1 100644 --- a/src/CircularProgress/CircularProgress.js +++ b/src/CircularProgress/CircularProgress.js @@ -1,4 +1,4 @@ -import React from 'react'; +import React, {Component, PropTypes} from 'react'; import autoPrefix from '../utils/autoPrefix'; import transitions from '../styles/transitions'; @@ -63,48 +63,48 @@ function getStyles(props, context) { return styles; } -class CircularProgress extends React.Component { +class CircularProgress extends Component { static propTypes = { /** * Override the progress's color. */ - color: React.PropTypes.string, + color: PropTypes.string, /** * Style for inner wrapper div. */ - innerStyle: React.PropTypes.object, + innerStyle: PropTypes.object, /** * The max value of progress, only works in determinate mode. */ - max: React.PropTypes.number, + max: PropTypes.number, /** * The min value of progress, only works in determinate mode. */ - min: React.PropTypes.number, + min: PropTypes.number, /** * The mode of show your progress, indeterminate * for when there is no value for progress. */ - mode: React.PropTypes.oneOf(['determinate', 'indeterminate']), + mode: PropTypes.oneOf(['determinate', 'indeterminate']), /** * The size of the progress. */ - size: React.PropTypes.number, + size: PropTypes.number, /** * Override the inline-styles of the root element. */ - style: React.PropTypes.object, + style: PropTypes.object, /** * The value of progress, only works in determinate mode. */ - value: React.PropTypes.number, + value: PropTypes.number, }; static defaultProps = { @@ -116,7 +116,7 @@ class CircularProgress extends React.Component { }; static contextTypes = { - muiTheme: React.PropTypes.object.isRequired, + muiTheme: PropTypes.object.isRequired, }; componentDidMount() { diff --git a/src/DatePicker/Calendar.js b/src/DatePicker/Calendar.js index 80129a0348530b..182da1f3928057 100644 --- a/src/DatePicker/Calendar.js +++ b/src/DatePicker/Calendar.js @@ -1,4 +1,4 @@ -import React from 'react'; +import React, {Component, PropTypes} from 'react'; import EventListener from 'react-event-listener'; import keycode from 'keycode'; import transitions from '../styles/transitions'; @@ -25,19 +25,19 @@ import { const daysArray = [...Array(7)]; -class Calendar extends React.Component { +class Calendar extends Component { static propTypes = { - DateTimeFormat: React.PropTypes.func.isRequired, - disableYearSelection: React.PropTypes.bool, - firstDayOfWeek: React.PropTypes.number, - initialDate: React.PropTypes.object, - locale: React.PropTypes.string.isRequired, - maxDate: React.PropTypes.object, - minDate: React.PropTypes.object, - mode: React.PropTypes.oneOf(['portrait', 'landscape']), - onDayTouchTap: React.PropTypes.func, - open: React.PropTypes.bool, - shouldDisableDate: React.PropTypes.func, + DateTimeFormat: PropTypes.func.isRequired, + disableYearSelection: PropTypes.bool, + firstDayOfWeek: PropTypes.number, + initialDate: PropTypes.object, + locale: PropTypes.string.isRequired, + maxDate: PropTypes.object, + minDate: PropTypes.object, + mode: PropTypes.oneOf(['portrait', 'landscape']), + onDayTouchTap: PropTypes.func, + open: PropTypes.bool, + shouldDisableDate: PropTypes.func, }; static defaultProps = { @@ -48,7 +48,7 @@ class Calendar extends React.Component { }; static contextTypes = { - muiTheme: React.PropTypes.object.isRequired, + muiTheme: PropTypes.object.isRequired, }; state = { diff --git a/src/DatePicker/CalendarMonth.js b/src/DatePicker/CalendarMonth.js index d029737b9af463..3687b4fc0e3952 100644 --- a/src/DatePicker/CalendarMonth.js +++ b/src/DatePicker/CalendarMonth.js @@ -1,18 +1,18 @@ -import React from 'react'; +import React, {Component, PropTypes} from 'react'; import {isBetweenDates, isEqualDate, getWeekArray} from './dateUtils'; import DayButton from './DayButton'; import ClearFix from '../internal/ClearFix'; -class CalendarMonth extends React.Component { +class CalendarMonth extends Component { static propTypes = { - autoOk: React.PropTypes.bool, - displayDate: React.PropTypes.object.isRequired, - firstDayOfWeek: React.PropTypes.number, - maxDate: React.PropTypes.object, - minDate: React.PropTypes.object, - onDayTouchTap: React.PropTypes.func, - selectedDate: React.PropTypes.object.isRequired, - shouldDisableDate: React.PropTypes.func, + autoOk: PropTypes.bool, + displayDate: PropTypes.object.isRequired, + firstDayOfWeek: PropTypes.number, + maxDate: PropTypes.object, + minDate: PropTypes.object, + onDayTouchTap: PropTypes.func, + selectedDate: PropTypes.object.isRequired, + shouldDisableDate: PropTypes.func, }; isSelectedDateDisabled() { diff --git a/src/DatePicker/CalendarToolbar.js b/src/DatePicker/CalendarToolbar.js index f8404e2ae80aee..aadd6737a575d6 100644 --- a/src/DatePicker/CalendarToolbar.js +++ b/src/DatePicker/CalendarToolbar.js @@ -1,4 +1,4 @@ -import React from 'react'; +import React, {Component, PropTypes} from 'react'; import IconButton from '../IconButton'; import Toolbar from '../Toolbar/Toolbar'; import ToolbarGroup from '../Toolbar/ToolbarGroup'; @@ -24,14 +24,14 @@ const styles = { }, }; -class CalendarToolbar extends React.Component { +class CalendarToolbar extends Component { static propTypes = { - DateTimeFormat: React.PropTypes.func.isRequired, - displayDate: React.PropTypes.object.isRequired, - locale: React.PropTypes.string.isRequired, - nextMonth: React.PropTypes.bool, - onMonthChange: React.PropTypes.func, - prevMonth: React.PropTypes.bool, + DateTimeFormat: PropTypes.func.isRequired, + displayDate: PropTypes.object.isRequired, + locale: PropTypes.string.isRequired, + nextMonth: PropTypes.bool, + onMonthChange: PropTypes.func, + prevMonth: PropTypes.bool, }; static defaultProps = { @@ -40,7 +40,7 @@ class CalendarToolbar extends React.Component { }; static contextTypes = { - muiTheme: React.PropTypes.object.isRequired, + muiTheme: PropTypes.object.isRequired, }; state = { diff --git a/src/DatePicker/CalendarYear.js b/src/DatePicker/CalendarYear.js index 5da4ea641094ea..f6fc04e41fc941 100644 --- a/src/DatePicker/CalendarYear.js +++ b/src/DatePicker/CalendarYear.js @@ -1,19 +1,19 @@ -import React from 'react'; +import React, {Component, PropTypes} from 'react'; import ReactDOM from 'react-dom'; import YearButton from './YearButton'; import {cloneDate} from './dateUtils'; -class CalendarYear extends React.Component { +class CalendarYear extends Component { static propTypes = { - displayDate: React.PropTypes.object.isRequired, - maxDate: React.PropTypes.object, - minDate: React.PropTypes.object, - onYearTouchTap: React.PropTypes.func, - selectedDate: React.PropTypes.object.isRequired, + displayDate: PropTypes.object.isRequired, + maxDate: PropTypes.object, + minDate: PropTypes.object, + onYearTouchTap: PropTypes.func, + selectedDate: PropTypes.object.isRequired, }; static contextTypes = { - muiTheme: React.PropTypes.object.isRequired, + muiTheme: PropTypes.object.isRequired, }; componentDidMount() { diff --git a/src/DatePicker/DateDisplay.js b/src/DatePicker/DateDisplay.js index 108d7b3848caa3..a0c5a7194d5002 100644 --- a/src/DatePicker/DateDisplay.js +++ b/src/DatePicker/DateDisplay.js @@ -1,4 +1,4 @@ -import React from 'react'; +import React, {Component, PropTypes} from 'react'; import transitions from '../styles/transitions'; import SlideInTransitionGroup from '../internal/SlideIn'; @@ -46,18 +46,18 @@ function getStyles(props, context, state) { return styles; } -class DateDisplay extends React.Component { +class DateDisplay extends Component { static propTypes = { - DateTimeFormat: React.PropTypes.func.isRequired, - disableYearSelection: React.PropTypes.bool, - locale: React.PropTypes.string.isRequired, - mode: React.PropTypes.oneOf(['portrait', 'landscape']), - monthDaySelected: React.PropTypes.bool, - onTouchTapMonthDay: React.PropTypes.func, - onTouchTapYear: React.PropTypes.func, - selectedDate: React.PropTypes.object.isRequired, - style: React.PropTypes.object, - weekCount: React.PropTypes.number, + DateTimeFormat: PropTypes.func.isRequired, + disableYearSelection: PropTypes.bool, + locale: PropTypes.string.isRequired, + mode: PropTypes.oneOf(['portrait', 'landscape']), + monthDaySelected: PropTypes.bool, + onTouchTapMonthDay: PropTypes.func, + onTouchTapYear: PropTypes.func, + selectedDate: PropTypes.object.isRequired, + style: PropTypes.object, + weekCount: PropTypes.number, }; static defaultProps = { @@ -67,7 +67,7 @@ class DateDisplay extends React.Component { }; static contextTypes = { - muiTheme: React.PropTypes.object.isRequired, + muiTheme: PropTypes.object.isRequired, }; state = { diff --git a/src/DatePicker/DatePicker.js b/src/DatePicker/DatePicker.js index 77cda626ec0572..b1bc38bb261ce8 100644 --- a/src/DatePicker/DatePicker.js +++ b/src/DatePicker/DatePicker.js @@ -1,10 +1,10 @@ -import React from 'react'; +import React, {Component, PropTypes} from 'react'; import {formatIso, isEqualDate} from './dateUtils'; import DatePickerDialog from './DatePickerDialog'; import TextField from '../TextField'; import deprecated from '../utils/deprecatedPropType'; -class DatePicker extends React.Component { +class DatePicker extends Component { static propTypes = { /** * Constructor for date formatting for the specified `locale`. @@ -12,41 +12,41 @@ class DatePicker extends React.Component { * `Intl.DateTimeFormat` is supported by most modern browsers, see http://caniuse.com/#search=intl, * otherwise https://github.com/andyearnshaw/Intl.js is a good polyfill. */ - DateTimeFormat: React.PropTypes.func, + DateTimeFormat: PropTypes.func, /** * If true, automatically accept and close the picker on select a date. */ - autoOk: React.PropTypes.bool, + autoOk: PropTypes.bool, /** * Override the default text of the 'Cancel' button. */ - cancelLabel: React.PropTypes.node, + cancelLabel: PropTypes.node, /** * Used to control how the DatePicker will be displayed when a user tries to set a date. * `dialog` (default) displays the DatePicker as a dialog with a modal. * `inline` displays the DatePicker below the input field (similar to auto complete). */ - container: React.PropTypes.oneOf(['dialog', 'inline']), + container: PropTypes.oneOf(['dialog', 'inline']), /** * This is the initial date value of the component. * If either `value` or `valueLink` is provided they will override this * prop with `value` taking precedence. */ - defaultDate: React.PropTypes.object, + defaultDate: PropTypes.object, /** * Disables the year selection in the date picker. */ - disableYearSelection: React.PropTypes.bool, + disableYearSelection: PropTypes.bool, /** * Disables the DatePicker. */ - disabled: React.PropTypes.bool, + disabled: PropTypes.bool, /** * Used to change the first day of week. It varies from @@ -54,7 +54,7 @@ class DatePicker extends React.Component { * The allowed range is 0 (Sunday) to 6 (Saturday). * The default is `1`, Monday, as per ISO 8601. */ - firstDayOfWeek: React.PropTypes.number, + firstDayOfWeek: PropTypes.number, /** * This function is called to format the date displayed in the input box, and should return a string. @@ -63,35 +63,35 @@ class DatePicker extends React.Component { * @param {object} date Date object to be formatted. * @returns {any} The formatted date. */ - formatDate: React.PropTypes.func, + formatDate: PropTypes.func, /** * Locale used for formatting the dialog date strings. If you are not using the default value, you * have to provide a `DateTimeFormat` that supports it. */ - locale: React.PropTypes.string, + locale: PropTypes.string, /** * The ending of a range of valid dates. The range includes the endDate. * The default value is current date + 100 years. */ - maxDate: React.PropTypes.object, + maxDate: PropTypes.object, /** * The beginning of a range of valid dates. The range includes the startDate. * The default value is current date - 100 years. */ - minDate: React.PropTypes.object, + minDate: PropTypes.object, /** * Tells the component to display the picker in portrait or landscape mode. */ - mode: React.PropTypes.oneOf(['portrait', 'landscape']), + mode: PropTypes.oneOf(['portrait', 'landscape']), /** * Override the default text of the 'OK' button. */ - okLabel: React.PropTypes.node, + okLabel: PropTypes.node, /** * Callback function that is fired when the date value changes. @@ -100,31 +100,31 @@ class DatePicker extends React.Component { * the first argument will always be null. * @param {object} date The new date. */ - onChange: React.PropTypes.func, + onChange: PropTypes.func, /** * Callback function that is fired when the Date Picker's dialog is dismissed. */ - onDismiss: React.PropTypes.func, + onDismiss: PropTypes.func, /** * Callback function that is fired when the Date Picker's `TextField` gains focus. * * @param {object} event `focus` event targeting the `TextField`. */ - onFocus: React.PropTypes.func, + onFocus: PropTypes.func, /** * Callback function that is fired when the Date Picker's dialog is shown. */ - onShow: React.PropTypes.func, + onShow: PropTypes.func, /** * Callback function that is fired when a touch tap event occurs on the Date Picker's `TextField`. * * @param {object} event TouchTap event targeting the `TextField`. */ - onTouchTap: React.PropTypes.func, + onTouchTap: PropTypes.func, /** * Callback function used to determine if a day's entry should be disabled on the calendar. @@ -132,32 +132,32 @@ class DatePicker extends React.Component { * @param {object} day Date object of a day. * @returns {boolean} Indicates whether the day should be disabled. */ - shouldDisableDate: React.PropTypes.func, + shouldDisableDate: PropTypes.func, /** * Override the inline-styles of the root element. */ - style: React.PropTypes.object, + style: PropTypes.object, /** * Override the inline-styles of DatePicker's TextField element. */ - textFieldStyle: React.PropTypes.object, + textFieldStyle: PropTypes.object, /** * Sets the date for the Date Picker programmatically. */ - value: React.PropTypes.any, + value: PropTypes.any, /** * Creates a ValueLink with the value of date picker. */ - valueLink: React.PropTypes.object, + valueLink: PropTypes.object, /** * Wordings used inside the button of the dialog. */ - wordings: deprecated(React.PropTypes.object, 'Instead, use `cancelLabel` and `okLabel`.'), + wordings: deprecated(PropTypes.object, 'Instead, use `cancelLabel` and `okLabel`.'), }; static defaultProps = { @@ -172,7 +172,7 @@ class DatePicker extends React.Component { }; static contextTypes = { - muiTheme: React.PropTypes.object.isRequired, + muiTheme: PropTypes.object.isRequired, }; state = { diff --git a/src/DatePicker/DatePickerDialog.js b/src/DatePicker/DatePickerDialog.js index 0d21e565367af5..4f010a25ded763 100644 --- a/src/DatePicker/DatePickerDialog.js +++ b/src/DatePicker/DatePickerDialog.js @@ -1,4 +1,4 @@ -import React from 'react'; +import React, {Component, PropTypes} from 'react'; import EventListener from 'react-event-listener'; import keycode from 'keycode'; import Calendar from './Calendar'; @@ -7,26 +7,26 @@ import DatePickerInline from './DatePickerInline'; import FlatButton from '../FlatButton'; import {dateTimeFormat} from './dateUtils'; -class DatePickerDialog extends React.Component { +class DatePickerDialog extends Component { static propTypes = { - DateTimeFormat: React.PropTypes.func, - autoOk: React.PropTypes.bool, - cancelLabel: React.PropTypes.node, - container: React.PropTypes.oneOf(['dialog', 'inline']), - disableYearSelection: React.PropTypes.bool, - firstDayOfWeek: React.PropTypes.number, - initialDate: React.PropTypes.object, - locale: React.PropTypes.string, - maxDate: React.PropTypes.object, - minDate: React.PropTypes.object, - mode: React.PropTypes.oneOf(['portrait', 'landscape']), - okLabel: React.PropTypes.node, - onAccept: React.PropTypes.func, - onDismiss: React.PropTypes.func, - onShow: React.PropTypes.func, - shouldDisableDate: React.PropTypes.func, - style: React.PropTypes.object, - wordings: React.PropTypes.object, + DateTimeFormat: PropTypes.func, + autoOk: PropTypes.bool, + cancelLabel: PropTypes.node, + container: PropTypes.oneOf(['dialog', 'inline']), + disableYearSelection: PropTypes.bool, + firstDayOfWeek: PropTypes.number, + initialDate: PropTypes.object, + locale: PropTypes.string, + maxDate: PropTypes.object, + minDate: PropTypes.object, + mode: PropTypes.oneOf(['portrait', 'landscape']), + okLabel: PropTypes.node, + onAccept: PropTypes.func, + onDismiss: PropTypes.func, + onShow: PropTypes.func, + shouldDisableDate: PropTypes.func, + style: PropTypes.object, + wordings: PropTypes.object, }; static defaultProps = { @@ -38,7 +38,7 @@ class DatePickerDialog extends React.Component { }; static contextTypes = { - muiTheme: React.PropTypes.object.isRequired, + muiTheme: PropTypes.object.isRequired, }; state = { diff --git a/src/DatePicker/DatePickerInline.js b/src/DatePicker/DatePickerInline.js index cb186fda86778c..9fb402db097495 100644 --- a/src/DatePicker/DatePickerInline.js +++ b/src/DatePicker/DatePickerInline.js @@ -1,4 +1,4 @@ -import React from 'react'; +import React, {Component, PropTypes} from 'react'; import Popover from '../Popover/Popover'; import PopoverAnimationFromTop from '../Popover/PopoverAnimationVertical'; @@ -10,17 +10,17 @@ const styles = { }, }; -class DatePickerInline extends React.Component { +class DatePickerInline extends Component { static propTypes = { - actions: React.PropTypes.node, - children: React.PropTypes.node, - onRequestClose: React.PropTypes.func.isRequired, - open: React.PropTypes.bool.isRequired, + actions: PropTypes.node, + children: PropTypes.node, + onRequestClose: PropTypes.func.isRequired, + open: PropTypes.bool.isRequired, /** * Override the inline-styles of the root element. */ - style: React.PropTypes.object, + style: PropTypes.object, }; static defaultProps = { diff --git a/src/DatePicker/DayButton.js b/src/DatePicker/DayButton.js index d9e1bd1e1ed18c..767157e6127a44 100644 --- a/src/DatePicker/DayButton.js +++ b/src/DatePicker/DayButton.js @@ -1,4 +1,4 @@ -import React from 'react'; +import React, {Component, PropTypes} from 'react'; import Transition from '../styles/transitions'; import {isEqualDate} from './dateUtils'; import EnhancedButton from '../internal/EnhancedButton'; @@ -57,13 +57,13 @@ function getStyles(props, context) { }; } -class DayButton extends React.Component { +class DayButton extends Component { static propTypes = { - date: React.PropTypes.object, - disabled: React.PropTypes.bool, - onKeyboardFocus: React.PropTypes.func, - onTouchTap: React.PropTypes.func, - selected: React.PropTypes.bool, + date: PropTypes.object, + disabled: PropTypes.bool, + onKeyboardFocus: PropTypes.func, + onTouchTap: PropTypes.func, + selected: PropTypes.bool, }; static defaultProps = { @@ -72,7 +72,7 @@ class DayButton extends React.Component { }; static contextTypes = { - muiTheme: React.PropTypes.object.isRequired, + muiTheme: PropTypes.object.isRequired, }; state = { diff --git a/src/DatePicker/YearButton.js b/src/DatePicker/YearButton.js index 120460b1f8ea0b..9cdda429f95578 100644 --- a/src/DatePicker/YearButton.js +++ b/src/DatePicker/YearButton.js @@ -1,4 +1,4 @@ -import React from 'react'; +import React, {Component, PropTypes} from 'react'; import EnhancedButton from '../internal/EnhancedButton'; function getStyles(props, context) { @@ -43,15 +43,15 @@ function getStyles(props, context) { }; } -class YearButton extends React.Component { +class YearButton extends Component { static propTypes = { /** * The css class name of the root element. */ - className: React.PropTypes.string, - onTouchTap: React.PropTypes.func, - selected: React.PropTypes.bool, - year: React.PropTypes.number, + className: PropTypes.string, + onTouchTap: PropTypes.func, + selected: PropTypes.bool, + year: PropTypes.number, }; static defaultProps = { @@ -59,7 +59,7 @@ class YearButton extends React.Component { }; static contextTypes = { - muiTheme: React.PropTypes.object.isRequired, + muiTheme: PropTypes.object.isRequired, }; state = { diff --git a/src/Dialog/Dialog.js b/src/Dialog/Dialog.js index 025535dc5d91ac..bdc2e7f16854f2 100644 --- a/src/Dialog/Dialog.js +++ b/src/Dialog/Dialog.js @@ -1,4 +1,4 @@ -import React from 'react'; +import React, {Component, PropTypes} from 'react'; import ReactDOM from 'react-dom'; import EventListener from 'react-event-listener'; import keycode from 'keycode'; @@ -9,14 +9,14 @@ import Paper from '../Paper'; import ReactTransitionGroup from 'react-addons-transition-group'; -class TransitionItem extends React.Component { +class TransitionItem extends Component { static propTypes = { - children: React.PropTypes.node, - style: React.PropTypes.object, + children: PropTypes.node, + style: PropTypes.object, }; static contextTypes = { - muiTheme: React.PropTypes.object.isRequired, + muiTheme: PropTypes.object.isRequired, }; state = { @@ -147,33 +147,33 @@ function getStyles(props, context) { }; } -class DialogInline extends React.Component { +class DialogInline extends Component { static propTypes = { - actions: React.PropTypes.node, - actionsContainerClassName: React.PropTypes.string, - actionsContainerStyle: React.PropTypes.object, - autoDetectWindowHeight: React.PropTypes.bool, - autoScrollBodyContent: React.PropTypes.bool, - bodyClassName: React.PropTypes.string, - bodyStyle: React.PropTypes.object, - children: React.PropTypes.node, - className: React.PropTypes.string, - contentClassName: React.PropTypes.string, - contentStyle: React.PropTypes.object, - modal: React.PropTypes.bool, - onRequestClose: React.PropTypes.func, - open: React.PropTypes.bool.isRequired, - overlayClassName: React.PropTypes.string, - overlayStyle: React.PropTypes.object, - repositionOnUpdate: React.PropTypes.bool, - style: React.PropTypes.object, - title: React.PropTypes.node, - titleClassName: React.PropTypes.string, - titleStyle: React.PropTypes.object, + actions: PropTypes.node, + actionsContainerClassName: PropTypes.string, + actionsContainerStyle: PropTypes.object, + autoDetectWindowHeight: PropTypes.bool, + autoScrollBodyContent: PropTypes.bool, + bodyClassName: PropTypes.string, + bodyStyle: PropTypes.object, + children: PropTypes.node, + className: PropTypes.string, + contentClassName: PropTypes.string, + contentStyle: PropTypes.object, + modal: PropTypes.bool, + onRequestClose: PropTypes.func, + open: PropTypes.bool.isRequired, + overlayClassName: PropTypes.string, + overlayStyle: PropTypes.object, + repositionOnUpdate: PropTypes.bool, + style: PropTypes.object, + title: PropTypes.node, + titleClassName: PropTypes.string, + titleStyle: PropTypes.object, }; static contextTypes = { - muiTheme: React.PropTypes.object.isRequired, + muiTheme: PropTypes.object.isRequired, }; componentDidMount() { @@ -347,117 +347,117 @@ class DialogInline extends React.Component { } } -class Dialog extends React.Component { +class Dialog extends Component { static propTypes = { /** * Action buttons to display below the Dialog content (`children`). * This property accepts either a React element, or an array of React elements. */ - actions: React.PropTypes.node, + actions: PropTypes.node, /** * The `className` to add to the actions container's root element. */ - actionsContainerClassName: React.PropTypes.string, + actionsContainerClassName: PropTypes.string, /** * Overrides the inline-styles of the actions container's root element. */ - actionsContainerStyle: React.PropTypes.object, + actionsContainerStyle: PropTypes.object, /** * If set to true, the height of the `Dialog` will be auto detected. A max height * will be enforced so that the content does not extend beyond the viewport. */ - autoDetectWindowHeight: React.PropTypes.bool, + autoDetectWindowHeight: PropTypes.bool, /** * If set to true, the body content of the `Dialog` will be scrollable. */ - autoScrollBodyContent: React.PropTypes.bool, + autoScrollBodyContent: PropTypes.bool, /** * The `className` to add to the content's root element under the title. */ - bodyClassName: React.PropTypes.string, + bodyClassName: PropTypes.string, /** * Overrides the inline-styles of the content's root element under the title. */ - bodyStyle: React.PropTypes.object, + bodyStyle: PropTypes.object, /** * The contents of the `Dialog`. */ - children: React.PropTypes.node, + children: PropTypes.node, /** * The css class name of the root element. */ - className: React.PropTypes.string, + className: PropTypes.string, /** * The `className` to add to the content container. */ - contentClassName: React.PropTypes.string, + contentClassName: PropTypes.string, /** * Overrides the inline-styles of the content container. */ - contentStyle: React.PropTypes.object, + contentStyle: PropTypes.object, /** * Force the user to use one of the actions in the `Dialog`. * Clicking outside the `Dialog` will not trigger the `onRequestClose`. */ - modal: React.PropTypes.bool, + modal: PropTypes.bool, /** * Fired when the `Dialog` is requested to be closed by a click outside the `Dialog` or on the buttons. * * @param {bool} buttonClicked Determines whether a button click triggered this request. */ - onRequestClose: React.PropTypes.func, + onRequestClose: PropTypes.func, /** * Controls whether the Dialog is opened or not. */ - open: React.PropTypes.bool.isRequired, + open: PropTypes.bool.isRequired, /** * The `className` to add to the `Overlay` component that is rendered behind the `Dialog`. */ - overlayClassName: React.PropTypes.string, + overlayClassName: PropTypes.string, /** * Overrides the inline-styles of the `Overlay` component that is rendered behind the `Dialog`. */ - overlayStyle: React.PropTypes.object, + overlayStyle: PropTypes.object, /** * Determines whether the `Dialog` should be repositioned when it's contents are updated. */ - repositionOnUpdate: React.PropTypes.bool, + repositionOnUpdate: PropTypes.bool, /** * Override the inline-styles of the root element. */ - style: React.PropTypes.object, + style: PropTypes.object, /** * The title to display on the `Dialog`. Could be number, string, element or an array containing these types. */ - title: React.PropTypes.node, + title: PropTypes.node, /** * The `className` to add to the title's root container element. */ - titleClassName: React.PropTypes.string, + titleClassName: PropTypes.string, /** * Overrides the inline-styles of the title's root container element. */ - titleStyle: React.PropTypes.object, + titleStyle: PropTypes.object, }; static defaultProps = { diff --git a/src/Divider/Divider.js b/src/Divider/Divider.js index d8f3bc631de6af..c767301d5a6a5e 100644 --- a/src/Divider/Divider.js +++ b/src/Divider/Divider.js @@ -1,20 +1,20 @@ -import React from 'react'; +import React, {PropTypes} from 'react'; const propTypes = { /** * The css class name of the root element. */ - className: React.PropTypes.string, + className: PropTypes.string, /** * If true, the `Divider` will be indented `72px`. */ - inset: React.PropTypes.bool, + inset: PropTypes.bool, /** * Override the inline-styles of the root element. */ - style: React.PropTypes.object, + style: PropTypes.object, }; const defaultProps = { @@ -22,7 +22,7 @@ const defaultProps = { }; const contextTypes = { - muiTheme: React.PropTypes.object.isRequired, + muiTheme: PropTypes.object.isRequired, }; const Divider = (props, context) => { diff --git a/src/Drawer/Drawer.js b/src/Drawer/Drawer.js index d019ff4caac7a8..957f73b17f0ba9 100644 --- a/src/Drawer/Drawer.js +++ b/src/Drawer/Drawer.js @@ -1,4 +1,4 @@ -import React from 'react'; +import React, {Component, PropTypes} from 'react'; import ReactDOM from 'react-dom'; import EventListener from 'react-event-listener'; import keycode from 'keycode'; @@ -10,38 +10,38 @@ import propTypes from '../utils/propTypes'; let openNavEventHandler = null; -class Drawer extends React.Component { +class Drawer extends Component { static propTypes = { /** * The contents of the `Drawer` */ - children: React.PropTypes.node, + children: PropTypes.node, /** * The CSS class name of the root element. */ - className: React.PropTypes.string, + className: PropTypes.string, /** * The CSS class name of the container element. */ - containerClassName: React.PropTypes.string, + containerClassName: PropTypes.string, /** * Override the inline-styles of the container element. */ - containerStyle: React.PropTypes.object, + containerStyle: PropTypes.object, /** * If true, swiping sideways when the `Drawer` is closed will not open it. */ - disableSwipeToOpen: React.PropTypes.bool, + disableSwipeToOpen: PropTypes.bool, /** * If true, the `Drawer` will be docked. In this state, the overlay won't show and * clicking on a menu item will not close the `Drawer`. */ - docked: React.PropTypes.bool, + docked: PropTypes.bool, /** * Callback function fired when the `open` state of the `Drawer` is requested to be changed. @@ -51,33 +51,33 @@ class Drawer extends React.Component { * 'swipe' for open requests; 'clickaway' (on overlay clicks), * 'escape' (on escape key press), and 'swipe' for close requests. */ - onRequestChange: React.PropTypes.func, + onRequestChange: PropTypes.func, /** * If true, the `Drawer` is opened. Providing a value will turn the `Drawer` * into a controlled component. */ - open: React.PropTypes.bool, + open: PropTypes.bool, /** * If true, the `Drawer` is positioned to open from the opposite side. */ - openSecondary: React.PropTypes.bool, + openSecondary: PropTypes.bool, /** * The CSS class name to add to the `Overlay` component that is rendered behind the `Drawer`. */ - overlayClassName: React.PropTypes.string, + overlayClassName: PropTypes.string, /** * Override the inline-styles of the `Overlay` component that is rendered behind the `Drawer`. */ - overlayStyle: React.PropTypes.object, + overlayStyle: PropTypes.object, /** * Override the inline-styles of the root element. */ - style: React.PropTypes.object, + style: PropTypes.object, /** * The width of the left most (or right most) area in pixels where the `Drawer` can be @@ -85,12 +85,12 @@ class Drawer extends React.Component { * (**CAUTION!** Setting this property to `null` might cause issues with sliders and * swipeable `Tabs`: use at your own risk). */ - swipeAreaWidth: React.PropTypes.number, + swipeAreaWidth: PropTypes.number, /** * The width of the `Drawer` in pixels. Defaults to using the values from theme. */ - width: React.PropTypes.number, + width: PropTypes.number, /** * The zDepth of the `Drawer`. @@ -110,7 +110,7 @@ class Drawer extends React.Component { }; static contextTypes = { - muiTheme: React.PropTypes.object.isRequired, + muiTheme: PropTypes.object.isRequired, }; componentWillMount() { diff --git a/src/DropDownMenu/DropDownMenu.js b/src/DropDownMenu/DropDownMenu.js index bd5e3883f35c79..3a283d39b4d376 100644 --- a/src/DropDownMenu/DropDownMenu.js +++ b/src/DropDownMenu/DropDownMenu.js @@ -1,4 +1,4 @@ -import React from 'react'; +import React, {Component, PropTypes} from 'react'; import transitions from '../styles/transitions'; import DropDownArrow from '../svg-icons/navigation/arrow-drop-down'; import Menu from '../Menu/Menu'; @@ -67,7 +67,7 @@ function getStyles(props, context) { }; } -class DropDownMenu extends React.Component { +class DropDownMenu extends Component { static muiName = 'DropDownMenu'; // The nested styles for drop-down-menu are modified by toolbar and possibly @@ -78,49 +78,49 @@ class DropDownMenu extends React.Component { * The width will automatically be set according to the items inside the menu. * To control this width in css instead, set this prop to `false`. */ - autoWidth: React.PropTypes.bool, + autoWidth: PropTypes.bool, /** * The `MenuItem`s to populate the `Menu` with. If the `MenuItems` have the * prop `label` that value will be used to render the representation of that * item within the field. */ - children: React.PropTypes.node, + children: PropTypes.node, /** * The css class name of the root element. */ - className: React.PropTypes.string, + className: PropTypes.string, /** * Disables the menu. */ - disabled: React.PropTypes.bool, + disabled: PropTypes.bool, /** * Overrides the styles of icon element. */ - iconStyle: React.PropTypes.object, + iconStyle: PropTypes.object, /** * Overrides the styles of label when the `DropDownMenu` is inactive. */ - labelStyle: React.PropTypes.object, + labelStyle: PropTypes.object, /** * The style object to use to override underlying list style. */ - listStyle: React.PropTypes.object, + listStyle: PropTypes.object, /** * The maximum height of the `Menu` when it is displayed. */ - maxHeight: React.PropTypes.number, + maxHeight: PropTypes.number, /** * Overrides the styles of `Menu` when the `DropDownMenu` is displayed. */ - menuStyle: React.PropTypes.object, + menuStyle: PropTypes.object, /** * Callback function fired when a menu item is clicked, other than the one currently selected. @@ -129,27 +129,27 @@ class DropDownMenu extends React.Component { * @param {number} key The index of the clicked menu item in the `children` collection. * @param {any} payload The `value` prop of the clicked menu item. */ - onChange: React.PropTypes.func, + onChange: PropTypes.func, /** * Set to true to have the `DropDownMenu` automatically open on mount. */ - openImmediately: React.PropTypes.bool, + openImmediately: PropTypes.bool, /** * Override the inline-styles of the root element. */ - style: React.PropTypes.object, + style: PropTypes.object, /** * Overrides the inline-styles of the underline. */ - underlineStyle: React.PropTypes.object, + underlineStyle: PropTypes.object, /** * The value that is currently selected. */ - value: React.PropTypes.any, + value: PropTypes.any, }; static defaultProps = { @@ -160,7 +160,7 @@ class DropDownMenu extends React.Component { }; static contextTypes = { - muiTheme: React.PropTypes.object.isRequired, + muiTheme: PropTypes.object.isRequired, }; state = { diff --git a/src/FlatButton/FlatButton.js b/src/FlatButton/FlatButton.js index 2269b964480ac1..bbffa375a80d3e 100644 --- a/src/FlatButton/FlatButton.js +++ b/src/FlatButton/FlatButton.js @@ -1,4 +1,4 @@ -import React from 'react'; +import React, {Component, PropTypes} from 'react'; import transitions from '../styles/transitions'; import {createChildFragment} from '../utils/childUtils'; import {fade} from '../utils/colorManipulator'; @@ -11,14 +11,14 @@ function validateLabel(props, propName, componentName) { } } -class FlatButton extends React.Component { +class FlatButton extends Component { static muiName = 'FlatButton'; static propTypes = { /** * Color of button when mouse is not hovering over it. */ - backgroundColor: React.PropTypes.string, + backgroundColor: PropTypes.string, /** * This is what will be displayed inside the button. @@ -29,27 +29,27 @@ class FlatButton extends React.Component { * that acts as our label to be displayed.) This only * applies to flat and raised buttons. */ - children: React.PropTypes.node, + children: PropTypes.node, /** * Disables the button if set to true. */ - disabled: React.PropTypes.bool, + disabled: PropTypes.bool, /** * Color of button when mouse hovers over. */ - hoverColor: React.PropTypes.string, + hoverColor: PropTypes.string, /** * URL to link to when button clicked if `linkButton` is set to true. */ - href: React.PropTypes.string, + href: PropTypes.string, /** * Use this property to display an icon. */ - icon: React.PropTypes.node, + icon: PropTypes.node, /** * Label for the button. @@ -59,7 +59,7 @@ class FlatButton extends React.Component { /** * Place label before or after the passed children. */ - labelPosition: React.PropTypes.oneOf([ + labelPosition: PropTypes.oneOf([ 'before', 'after', ]), @@ -67,12 +67,12 @@ class FlatButton extends React.Component { /** * Override the inline-styles of the button's label element. */ - labelStyle: React.PropTypes.object, + labelStyle: PropTypes.object, /** * Enables use of `href` property to provide a URL to link to if set to true. */ - linkButton: React.PropTypes.bool, + linkButton: PropTypes.bool, /** * Callback function fired when the element is focused or blurred by the keyboard. @@ -80,50 +80,50 @@ class FlatButton extends React.Component { * @param {object} event `focus` or `blur` event targeting the element. * @param {boolean} isKeyboardFocused Indicates whether the element is focused. */ - onKeyboardFocus: React.PropTypes.func, + onKeyboardFocus: PropTypes.func, /** * Callback function fired when the mouse enters the element. * * @param {object} event `mouseenter` event targeting the element. */ - onMouseEnter: React.PropTypes.func, + onMouseEnter: PropTypes.func, /** * Callback function fired when the mouse leaves the element. * * @param {object} event `mouseleave` event targeting the element. */ - onMouseLeave: React.PropTypes.func, + onMouseLeave: PropTypes.func, /** * Callback function fired when the element is touched. * * @param {object} event `touchstart` event targeting the element. */ - onTouchStart: React.PropTypes.func, + onTouchStart: PropTypes.func, /** * If true, colors button according to * primaryTextColor from the Theme. */ - primary: React.PropTypes.bool, + primary: PropTypes.bool, /** * Color for the ripple after button is clicked. */ - rippleColor: React.PropTypes.string, + rippleColor: PropTypes.string, /** * If true, colors button according to secondaryTextColor from the theme. * The primary prop has precendent if set to true. */ - secondary: React.PropTypes.bool, + secondary: PropTypes.bool, /** * Override the inline-styles of the root element. */ - style: React.PropTypes.object, + style: PropTypes.object, }; static defaultProps = { @@ -139,7 +139,7 @@ class FlatButton extends React.Component { }; static contextTypes = { - muiTheme: React.PropTypes.object.isRequired, + muiTheme: PropTypes.object.isRequired, }; state = { diff --git a/src/FlatButton/FlatButtonLabel.js b/src/FlatButton/FlatButtonLabel.js index edc490b8b481db..93f6f4e7c407a7 100644 --- a/src/FlatButton/FlatButtonLabel.js +++ b/src/FlatButton/FlatButtonLabel.js @@ -1,4 +1,4 @@ -import React from 'react'; +import React, {Component, PropTypes} from 'react'; function getStyles(props, context) { const {baseTheme} = context.muiTheme; @@ -13,18 +13,18 @@ function getStyles(props, context) { }; } -class FlatButtonLabel extends React.Component { +class FlatButtonLabel extends Component { static propTypes = { - label: React.PropTypes.node, + label: PropTypes.node, /** * Override the inline-styles of the root element. */ - style: React.PropTypes.object, + style: PropTypes.object, }; static contextTypes = { - muiTheme: React.PropTypes.object.isRequired, + muiTheme: PropTypes.object.isRequired, }; render() { diff --git a/src/FloatingActionButton/FloatingActionButton.js b/src/FloatingActionButton/FloatingActionButton.js index 8aacec39450f44..088ebef6b6f74c 100644 --- a/src/FloatingActionButton/FloatingActionButton.js +++ b/src/FloatingActionButton/FloatingActionButton.js @@ -1,4 +1,4 @@ -import React from 'react'; +import React, {Component, PropTypes} from 'react'; import transitions from '../styles/transitions'; import {fade} from '../utils/colorManipulator'; import EnhancedButton from '../internal/EnhancedButton'; @@ -63,39 +63,39 @@ function getStyles(props, context) { }; } -class FloatingActionButton extends React.Component { +class FloatingActionButton extends Component { static propTypes = { /** * This value will override the default background color for the button. * However it will not override the default disabled background color. * This has to be set separately using the disabledColor attribute. */ - backgroundColor: React.PropTypes.string, + backgroundColor: PropTypes.string, /** * This is what displayed inside the floating action button; for example, a SVG Icon. */ - children: React.PropTypes.node, + children: PropTypes.node, /** * The css class name of the root element. */ - className: React.PropTypes.string, + className: PropTypes.string, /** * Disables the button if set to true. */ - disabled: React.PropTypes.bool, + disabled: PropTypes.bool, /** * This value will override the default background color for the button when it is disabled. */ - disabledColor: React.PropTypes.string, + disabledColor: PropTypes.string, /** * URL to link to when button clicked if `linkButton` is set to true. */ - href: React.PropTypes.string, + href: PropTypes.string, /** * The icon within the FloatingActionButton is a FontIcon component. @@ -103,75 +103,75 @@ class FloatingActionButton extends React.Component { * An alternative to adding an iconClassName would be to manually insert a * FontIcon component or custom SvgIcon component or as a child of FloatingActionButton. */ - iconClassName: React.PropTypes.string, + iconClassName: PropTypes.string, /** * This is the equivalent to iconClassName except that it is used for * overriding the inline-styles of the FontIcon component. */ - iconStyle: React.PropTypes.object, + iconStyle: PropTypes.object, /** * Enables use of `href` property to provide a URL to link to if set to true. */ - linkButton: React.PropTypes.bool, + linkButton: PropTypes.bool, /** * If true, the button will be a small floating action button. */ - mini: React.PropTypes.bool, + mini: PropTypes.bool, /** * Callback function fired when a mouse button is pressed down on the elmeent. * * @param {object} event `mousedown` event targeting the element. */ - onMouseDown: React.PropTypes.func, + onMouseDown: PropTypes.func, /** * Callback function fired when the mouse enters the element. * * @param {object} event `mouseenter` event targeting the element. */ - onMouseEnter: React.PropTypes.func, + onMouseEnter: PropTypes.func, /** * Callback function fired when the mouse leaves the element. * * @param {object} event `mouseleave` event targeting the element. */ - onMouseLeave: React.PropTypes.func, + onMouseLeave: PropTypes.func, /** * Callback function fired when a mouse button is released on the element. * * @param {object} event `mouseup` event targeting the element. */ - onMouseUp: React.PropTypes.func, + onMouseUp: PropTypes.func, /** * Callback function fired when a touch point is removed from the element. * * @param {object} event `touchend` event targeting the element. */ - onTouchEnd: React.PropTypes.func, + onTouchEnd: PropTypes.func, /** * Callback function fired when the element is touched. * * @param {object} event `touchstart` event targeting the element. */ - onTouchStart: React.PropTypes.func, + onTouchStart: PropTypes.func, /** * If true, the button will use the secondary button colors. */ - secondary: React.PropTypes.bool, + secondary: PropTypes.bool, /** * Override the inline-styles of the root element. */ - style: React.PropTypes.object, + style: PropTypes.object, /** * The zDepth of the underlying `Paper` component. @@ -187,7 +187,7 @@ class FloatingActionButton extends React.Component { }; static contextTypes = { - muiTheme: React.PropTypes.object.isRequired, + muiTheme: PropTypes.object.isRequired, }; state = { diff --git a/src/FontIcon/FontIcon.js b/src/FontIcon/FontIcon.js index 156f149102f076..769164d1f3092a 100644 --- a/src/FontIcon/FontIcon.js +++ b/src/FontIcon/FontIcon.js @@ -1,4 +1,4 @@ -import React from 'react'; +import React, {Component, PropTypes} from 'react'; import transitions from '../styles/transitions'; function getStyles(props, context, state) { @@ -23,7 +23,7 @@ function getStyles(props, context, state) { }; } -class FontIcon extends React.Component { +class FontIcon extends Component { static muiName = 'FontIcon'; static propTypes = { @@ -31,31 +31,31 @@ class FontIcon extends React.Component { * This is the font color of the font icon. If not specified, * this component will default to muiTheme.palette.textColor. */ - color: React.PropTypes.string, + color: PropTypes.string, /** * This is the icon color when the mouse hovers over the icon. */ - hoverColor: React.PropTypes.string, + hoverColor: PropTypes.string, /** * Callback function fired when the mouse enters the element. * * @param {object} event `mouseenter` event targeting the element. */ - onMouseEnter: React.PropTypes.func, + onMouseEnter: PropTypes.func, /** * Callback function fired when the mouse leaves the element. * * @param {object} event `mouseleave` event targeting the element. */ - onMouseLeave: React.PropTypes.func, + onMouseLeave: PropTypes.func, /** * Override the inline-styles of the root element. */ - style: React.PropTypes.object, + style: PropTypes.object, }; static defaultProps = { @@ -64,7 +64,7 @@ class FontIcon extends React.Component { }; static contextTypes = { - muiTheme: React.PropTypes.object.isRequired, + muiTheme: PropTypes.object.isRequired, }; state = { diff --git a/src/GridList/GridList.js b/src/GridList/GridList.js index 621951a77251fc..86b97ef49cbc9d 100644 --- a/src/GridList/GridList.js +++ b/src/GridList/GridList.js @@ -1,4 +1,4 @@ -import React from 'react'; +import React, {Component, PropTypes} from 'react'; function getStyles(props) { return { @@ -14,32 +14,32 @@ function getStyles(props) { }; } -class GridList extends React.Component { +class GridList extends Component { static propTypes = { /** * Number of px for one cell height. */ - cellHeight: React.PropTypes.number, + cellHeight: PropTypes.number, /** * Grid Tiles that will be in Grid List. */ - children: React.PropTypes.node, + children: PropTypes.node, /** * Number of columns. */ - cols: React.PropTypes.number, + cols: PropTypes.number, /** * Number of px for the padding/spacing between items. */ - padding: React.PropTypes.number, + padding: PropTypes.number, /** * Override the inline-styles of the root element. */ - style: React.PropTypes.object, + style: PropTypes.object, }; static defaultProps = { @@ -49,7 +49,7 @@ class GridList extends React.Component { }; static contextTypes = { - muiTheme: React.PropTypes.object.isRequired, + muiTheme: PropTypes.object.isRequired, }; render() { diff --git a/src/GridList/GridTile.js b/src/GridList/GridTile.js index 8e86464d6be563..6a3670400bdf85 100644 --- a/src/GridList/GridTile.js +++ b/src/GridList/GridTile.js @@ -1,4 +1,4 @@ -import React from 'react'; +import React, {Component, PropTypes} from 'react'; function getStyles(props, context) { const { @@ -57,30 +57,30 @@ function getStyles(props, context) { return styles; } -class GridTile extends React.Component { +class GridTile extends Component { static propTypes = { /** * An IconButton element to be used as secondary action target * (primary action target is the tile itself). */ - actionIcon: React.PropTypes.element, + actionIcon: PropTypes.element, /** * Position of secondary action IconButton. */ - actionPosition: React.PropTypes.oneOf(['left', 'right']), + actionPosition: PropTypes.oneOf(['left', 'right']), /** * Theoretically you can pass any node as children, but the main use case is to pass an img, * in whichcase GridTile takes care of making the image "cover" available space * (similar to background-size: cover or to object-fit:cover). */ - children: React.PropTypes.node, + children: PropTypes.node, /** * Width of the tile in number of grid cells. */ - cols: React.PropTypes.number, + cols: PropTypes.number, /** * Either a string used as tag name for the tile root element, or a ReactElement. @@ -89,41 +89,41 @@ class GridTile extends React.Component { * In case you pass a ReactElement, please ensure that it passes all props, * accepts styles overrides and render it's children. */ - containerElement: React.PropTypes.oneOfType([ - React.PropTypes.string, - React.PropTypes.element, + containerElement: PropTypes.oneOfType([ + PropTypes.string, + PropTypes.element, ]), /** * Height of the tile in number of grid cells. */ - rows: React.PropTypes.number, + rows: PropTypes.number, /** * Override the inline-styles of the root element. */ - style: React.PropTypes.object, + style: PropTypes.object, /** * String or element serving as subtitle (support text). */ - subtitle: React.PropTypes.node, + subtitle: PropTypes.node, /** * Title to be displayed on tile. */ - title: React.PropTypes.node, + title: PropTypes.node, /** * Style used for title bar background. * Useful for setting custom gradients for example */ - titleBackground: React.PropTypes.string, + titleBackground: PropTypes.string, /** * Position of the title bar (container of title, subtitle and action icon). */ - titlePosition: React.PropTypes.oneOf(['top', 'bottom']), + titlePosition: PropTypes.oneOf(['top', 'bottom']), }; static defaultProps = { @@ -136,7 +136,7 @@ class GridTile extends React.Component { }; static contextTypes = { - muiTheme: React.PropTypes.object.isRequired, + muiTheme: PropTypes.object.isRequired, }; componentDidMount() { diff --git a/src/IconButton/IconButton.js b/src/IconButton/IconButton.js index fc6c7a4cbaa9c0..b863ec23457d6a 100644 --- a/src/IconButton/IconButton.js +++ b/src/IconButton/IconButton.js @@ -1,4 +1,4 @@ -import React from 'react'; +import React, {Component, PropTypes} from 'react'; import transitions from '../styles/transitions'; import propTypes from '../utils/propTypes'; import EnhancedButton from '../internal/EnhancedButton'; @@ -41,51 +41,51 @@ function getStyles(props, context) { }; } -class IconButton extends React.Component { +class IconButton extends Component { static muiName = 'IconButton'; static propTypes = { /** * Can be used to pass a `FontIcon` element as the icon for the button. */ - children: React.PropTypes.node, + children: PropTypes.node, /** * The CSS class name of the root element. */ - className: React.PropTypes.string, + className: PropTypes.string, /** * If true, the element's ripple effect will be disabled. */ - disableTouchRipple: React.PropTypes.bool, + disableTouchRipple: PropTypes.bool, /** * If true, the element will be disabled. */ - disabled: React.PropTypes.bool, + disabled: PropTypes.bool, /** * The CSS class name of the icon. Used for setting the icon with a stylesheet. */ - iconClassName: React.PropTypes.string, + iconClassName: PropTypes.string, /** * Override the inline-styles of the icon element. */ - iconStyle: React.PropTypes.object, + iconStyle: PropTypes.object, /** * Callback function fired when the element loses focus. * @param {object} event `blur` event targeting the element. */ - onBlur: React.PropTypes.func, + onBlur: PropTypes.func, /** * Callback function fired when the element gains focus. * @param {object} event `focus` event targeting the element. */ - onFocus: React.PropTypes.func, + onFocus: PropTypes.func, /** * Callback function fired when the element is focused or blurred by the keyboard. @@ -93,21 +93,21 @@ class IconButton extends React.Component { * @param {object} event `focus` or `blur` event targeting the element. * @param {boolean} keyboardFocused Indicates whether the element is focused. */ - onKeyboardFocus: React.PropTypes.func, + onKeyboardFocus: PropTypes.func, /** * Callback function fired when the mouse enters the element. * * @param {object} event `mouseenter` event targeting the element. */ - onMouseEnter: React.PropTypes.func, + onMouseEnter: PropTypes.func, /** * Callback function fired when the mouse leaves the element. * * @param {object} event `mouseleave` event targeting the element. */ - onMouseLeave: React.PropTypes.func, + onMouseLeave: PropTypes.func, /** * Callback function fired when the mouse leaves the element. Unlike `onMouseLeave`, @@ -115,17 +115,17 @@ class IconButton extends React.Component { * * @param {object} event `mouseout` event targeting the element. */ - onMouseOut: React.PropTypes.func, + onMouseOut: PropTypes.func, /** * Override the inline-styles of the root element. */ - style: React.PropTypes.object, + style: PropTypes.object, /** * The text to supply to the element's tooltip. */ - tooltip: React.PropTypes.node, + tooltip: PropTypes.node, /** * The vertical and horizontal positions, respectively, of the element's tooltip. @@ -137,13 +137,13 @@ class IconButton extends React.Component { /** * Override the inline-styles of the tooltip element. */ - tooltipStyles: React.PropTypes.object, + tooltipStyles: PropTypes.object, /** * If true, increase the tooltip element's size. Useful for increasing tooltip * readability on mobile devices. */ - touch: React.PropTypes.bool, + touch: PropTypes.bool, }; static defaultProps = { @@ -155,7 +155,7 @@ class IconButton extends React.Component { }; static contextTypes = { - muiTheme: React.PropTypes.object.isRequired, + muiTheme: PropTypes.object.isRequired, }; state = { diff --git a/src/IconMenu/IconMenu.js b/src/IconMenu/IconMenu.js index e75b1cd9f25cf7..7e82b3127210a6 100644 --- a/src/IconMenu/IconMenu.js +++ b/src/IconMenu/IconMenu.js @@ -1,11 +1,11 @@ -import React from 'react'; +import React, {Component, PropTypes} from 'react'; import ReactDOM from 'react-dom'; import Events from '../utils/events'; import propTypes from '../utils/propTypes'; import Menu from '../Menu/Menu'; import Popover from '../Popover/Popover'; -class IconMenu extends React.Component { +class IconMenu extends Component { static muiName = 'IconMenu'; static propTypes = { @@ -21,32 +21,32 @@ class IconMenu extends React.Component { /** * Should be used to pass `MenuItem` components. */ - children: React.PropTypes.node, + children: PropTypes.node, /** * The CSS class name of the root element. */ - className: React.PropTypes.string, + className: PropTypes.string, /** * This is the `IconButton` to render. This button will open the menu. */ - iconButtonElement: React.PropTypes.element.isRequired, + iconButtonElement: PropTypes.element.isRequired, /** * Override the inline-styles of the underlying icon element. */ - iconStyle: React.PropTypes.object, + iconStyle: PropTypes.object, /** * Override the inline-styles of the menu element. */ - menuStyle: React.PropTypes.object, + menuStyle: PropTypes.object, /** * If true, the value can an be array and allow the menu to be a multi-select. */ - multiple: React.PropTypes.bool, + multiple: PropTypes.bool, /** * Callback function fired when a menu item is selected with a touch-tap. @@ -54,7 +54,7 @@ class IconMenu extends React.Component { * @param {object} event TouchTap event targeting the selected menu item element. * @param {object} child The selected element. */ - onItemTouchTap: React.PropTypes.func, + onItemTouchTap: PropTypes.func, /** * Callback function fired when the `IconButton` element is focused or blurred by the keyboard. @@ -62,35 +62,35 @@ class IconMenu extends React.Component { * @param {object} event `focus` or `blur` event targeting the `IconButton` element. * @param {boolean} keyboardFocused If true, the `IconButton` element is focused. */ - onKeyboardFocus: React.PropTypes.func, + onKeyboardFocus: PropTypes.func, /** * Callback function fired when a mouse button is pressed down on the `IconButton` element. * * @param {object} event `mousedown` event targeting the `IconButton` element. */ - onMouseDown: React.PropTypes.func, + onMouseDown: PropTypes.func, /** * Callback function fired when the mouse enters the `IconButton` element. * * @param {object} event `mouseenter` event targeting the `IconButton` element. */ - onMouseEnter: React.PropTypes.func, + onMouseEnter: PropTypes.func, /** * Callback function fired when the mouse leaves the `IconButton` element. * * @param {object} event `mouseleave` event targeting the `IconButton` element. */ - onMouseLeave: React.PropTypes.func, + onMouseLeave: PropTypes.func, /** * Callback function fired when a mouse button is released on the `IconButton` element. * * @param {object} event `mouseup` event targeting the `IconButton` element. */ - onMouseUp: React.PropTypes.func, + onMouseUp: PropTypes.func, /** * Callback function fired when the `open` state of the menu is requested to be changed. @@ -100,24 +100,24 @@ class IconMenu extends React.Component { * 'keyboard' and 'iconTap' for open requests; 'enter', 'escape', 'itemTap', and 'clickAway' * for close requests. */ - onRequestChange: React.PropTypes.func, + onRequestChange: PropTypes.func, /** * Callback function fired when the `IconButton` element is touch-tapped. * * @param {object} event TouchTap event targeting the `IconButton` element. */ - onTouchTap: React.PropTypes.func, + onTouchTap: PropTypes.func, /** * If true, the `IconMenu` is opened. */ - open: React.PropTypes.bool, + open: PropTypes.bool, /** * Override the inline-styles of the root element. */ - style: React.PropTypes.object, + style: PropTypes.object, /** * This is the point on the menu which will stick to the menu @@ -134,13 +134,13 @@ class IconMenu extends React.Component { * If set to 0 then the auto close functionality * will be disabled. */ - touchTapCloseDelay: React.PropTypes.number, + touchTapCloseDelay: PropTypes.number, /** * If true, the popover will render on top of an invisible * layer, which will prevent clicks to the underlying elements. */ - useLayerForClickAway: React.PropTypes.bool, + useLayerForClickAway: PropTypes.bool, }; static defaultProps = { @@ -167,7 +167,7 @@ class IconMenu extends React.Component { }; static contextTypes = { - muiTheme: React.PropTypes.object.isRequired, + muiTheme: PropTypes.object.isRequired, }; state = { diff --git a/src/LinearProgress/LinearProgress.js b/src/LinearProgress/LinearProgress.js index 26c33d0f6869dd..ec2968781828bf 100644 --- a/src/LinearProgress/LinearProgress.js +++ b/src/LinearProgress/LinearProgress.js @@ -1,4 +1,4 @@ -import React from 'react'; +import React, {Component, PropTypes} from 'react'; import transitions from '../styles/transitions'; function getRelativeValue(value, min, max) { @@ -62,39 +62,39 @@ function getStyles(props, context) { return styles; } -class LinearProgress extends React.Component { +class LinearProgress extends Component { static propTypes = { /** * The mode of show your progress, indeterminate for * when there is no value for progress. */ - color: React.PropTypes.string, + color: PropTypes.string, /** * The max value of progress, only works in determinate mode. */ - max: React.PropTypes.number, + max: PropTypes.number, /** * The min value of progress, only works in determinate mode. */ - min: React.PropTypes.number, + min: PropTypes.number, /** * The mode of show your progress, indeterminate for when * there is no value for progress. */ - mode: React.PropTypes.oneOf(['determinate', 'indeterminate']), + mode: PropTypes.oneOf(['determinate', 'indeterminate']), /** * Override the inline-styles of the root element. */ - style: React.PropTypes.object, + style: PropTypes.object, /** * The value of progress, only works in determinate mode. */ - value: React.PropTypes.number, + value: PropTypes.number, }; static defaultProps = { @@ -105,7 +105,7 @@ class LinearProgress extends React.Component { }; static contextTypes = { - muiTheme: React.PropTypes.object.isRequired, + muiTheme: PropTypes.object.isRequired, }; componentDidMount() { diff --git a/src/List/List.js b/src/List/List.js index d441ef936c5d40..cf7c2d08215338 100644 --- a/src/List/List.js +++ b/src/List/List.js @@ -1,38 +1,38 @@ -import React from 'react'; +import React, {Component, PropTypes} from 'react'; import propTypes from '../utils/propTypes'; import Subheader from '../Subheader'; import deprecated from '../utils/deprecatedPropType'; import warning from 'warning'; -class List extends React.Component { +class List extends Component { static propTypes = { /** * These are usually `ListItem`s that are passed to * be part of the list. */ - children: React.PropTypes.node, + children: PropTypes.node, /** * If true, the subheader will be indented by 72px. */ - insetSubheader: deprecated(React.PropTypes.bool, + insetSubheader: deprecated(PropTypes.bool, 'Refer to the `subheader` property.'), /** * Override the inline-styles of the root element. */ - style: React.PropTypes.object, + style: PropTypes.object, /** * The subheader string that will be displayed at the top of the list. */ - subheader: deprecated(React.PropTypes.node, + subheader: deprecated(PropTypes.node, 'Instead, nest the `Subheader` component directly inside the `List`.'), /** * Override the inline-styles of the subheader element. */ - subheaderStyle: deprecated(React.PropTypes.object, + subheaderStyle: deprecated(PropTypes.object, 'Refer to the `subheader` property.'), /** @@ -44,7 +44,7 @@ class List extends React.Component { }; static contextTypes = { - muiTheme: React.PropTypes.object.isRequired, + muiTheme: PropTypes.object.isRequired, }; render() { diff --git a/src/List/ListItem.js b/src/List/ListItem.js index 9c030785bc87fa..26e9aace2ae8c5 100644 --- a/src/List/ListItem.js +++ b/src/List/ListItem.js @@ -1,4 +1,4 @@ -import React from 'react'; +import React, {Component, PropTypes} from 'react'; import ReactDOM from 'react-dom'; import shallowEqual from 'recompose/shallowEqual'; import {fade} from '../utils/colorManipulator'; @@ -142,7 +142,7 @@ function getStyles(props, context, state) { return styles; } -class ListItem extends React.Component { +class ListItem extends Component { static muiName = 'ListItem'; static propTypes = { @@ -152,17 +152,17 @@ class ListItem extends React.Component { * if a `rightIcon` or `rightIconButton` has been provided to * the element. */ - autoGenerateNestedIndicator: React.PropTypes.bool, + autoGenerateNestedIndicator: PropTypes.bool, /** * Children passed into the `ListItem`. */ - children: React.PropTypes.node, + children: PropTypes.node, /** * If true, the element will not be able to be focused by the keyboard. */ - disableKeyboardFocus: React.PropTypes.bool, + disableKeyboardFocus: PropTypes.bool, /** * If true, the element will not be clickable @@ -170,54 +170,54 @@ class ListItem extends React.Component { * This is automatically disabled if either `leftCheckbox` * or `rightToggle` is set. */ - disabled: React.PropTypes.bool, + disabled: PropTypes.bool, /** * If true, the nested `ListItem`s are initially displayed. */ - initiallyOpen: React.PropTypes.bool, + initiallyOpen: PropTypes.bool, /** * Override the inline-styles of the inner div element. */ - innerDivStyle: React.PropTypes.object, + innerDivStyle: PropTypes.object, /** * If true, the children will be indented by 72px. * This is useful if there is no left avatar or left icon. */ - insetChildren: React.PropTypes.bool, + insetChildren: PropTypes.bool, /** * This is the `Avatar` element to be displayed on the left side. */ - leftAvatar: React.PropTypes.element, + leftAvatar: PropTypes.element, /** * This is the `Checkbox` element to be displayed on the left side. */ - leftCheckbox: React.PropTypes.element, + leftCheckbox: PropTypes.element, /** * This is the `SvgIcon` or `FontIcon` to be displayed on the left side. */ - leftIcon: React.PropTypes.element, + leftIcon: PropTypes.element, /** * An array of `ListItem`s to nest underneath the current `ListItem`. */ - nestedItems: React.PropTypes.arrayOf(React.PropTypes.element), + nestedItems: PropTypes.arrayOf(PropTypes.element), /** * Controls how deep a `ListItem` appears. * This property is automatically managed, so modify at your own risk. */ - nestedLevel: React.PropTypes.number, + nestedLevel: PropTypes.number, /** * Override the inline-styles of the nested items' `NestedList`. */ - nestedListStyle: React.PropTypes.object, + nestedListStyle: PropTypes.object, /** * Callback function fired when the `ListItem` is focused or blurred by the keyboard. @@ -225,64 +225,64 @@ class ListItem extends React.Component { * @param {object} event `focus` or `blur` event targeting the `ListItem`. * @param {boolean} isKeyboardFocused If true, the `ListItem` is focused. */ - onKeyboardFocus: React.PropTypes.func, + onKeyboardFocus: PropTypes.func, /** * Callback function fired when the mouse enters the `ListItem`. * * @param {object} event `mouseenter` event targeting the `ListItem`. */ - onMouseEnter: React.PropTypes.func, + onMouseEnter: PropTypes.func, /** * Callback function fired when the mouse leaves the `ListItem`. * * @param {object} event `mouseleave` event targeting the `ListItem`. */ - onMouseLeave: React.PropTypes.func, + onMouseLeave: PropTypes.func, /** * Callbak function fired when the `ListItem` toggles its nested list. * * @param {object} listItem The `ListItem`. */ - onNestedListToggle: React.PropTypes.func, + onNestedListToggle: PropTypes.func, /** * Callback function fired when the `ListItem` is touched. * * @param {object} event `touchstart` event targeting the `ListItem`. */ - onTouchStart: React.PropTypes.func, + onTouchStart: PropTypes.func, /** * Callback function fired when the `ListItem` is touch-tapped. * * @param {object} event TouchTap event targeting the `ListItem`. */ - onTouchTap: React.PropTypes.func, + onTouchTap: PropTypes.func, /** * This is the block element that contains the primary text. * If a string is passed in, a div tag will be rendered. */ - primaryText: React.PropTypes.node, + primaryText: PropTypes.node, /** * If true, clicking or tapping the primary text of the `ListItem` * toggles the nested list. */ - primaryTogglesNestedList: React.PropTypes.bool, + primaryTogglesNestedList: PropTypes.bool, /** * This is the `Avatar` element to be displayed on the right side. */ - rightAvatar: React.PropTypes.element, + rightAvatar: PropTypes.element, /** * This is the `SvgIcon` or `FontIcon` to be displayed on the right side. */ - rightIcon: React.PropTypes.element, + rightIcon: PropTypes.element, /** * This is the `IconButton` to be displayed on the right side. @@ -291,29 +291,29 @@ class ListItem extends React.Component { * ripple on the `ListItem`; the event will be stopped and prevented * from bubbling up to cause a `ListItem` click. */ - rightIconButton: React.PropTypes.element, + rightIconButton: PropTypes.element, /** * This is the `Toggle` element to display on the right side. */ - rightToggle: React.PropTypes.element, + rightToggle: PropTypes.element, /** * This is the block element that contains the secondary text. * If a string is passed in, a div tag will be rendered. */ - secondaryText: React.PropTypes.node, + secondaryText: PropTypes.node, /** * Can be 1 or 2. This is the number of secondary * text lines before ellipsis will show. */ - secondaryTextLines: React.PropTypes.oneOf([1, 2]), + secondaryTextLines: PropTypes.oneOf([1, 2]), /** * Override the inline-styles of the root element. */ - style: React.PropTypes.object, + style: PropTypes.object, }; static defaultProps = { @@ -334,7 +334,7 @@ class ListItem extends React.Component { }; static contextTypes = { - muiTheme: React.PropTypes.object.isRequired, + muiTheme: PropTypes.object.isRequired, }; state = { diff --git a/src/List/MakeSelectable.js b/src/List/MakeSelectable.js index ffb0508b63701a..2197789abfa24b 100644 --- a/src/List/MakeSelectable.js +++ b/src/List/MakeSelectable.js @@ -1,22 +1,22 @@ -import React from 'react'; +import React, {Component, PropTypes} from 'react'; import {fade} from '../utils/colorManipulator'; import deprecated from '../utils/deprecatedPropType'; export const MakeSelectable = (Component) => { - return class extends React.Component { + return class extends Component { static propTypes = { - children: React.PropTypes.node, - onChange: React.PropTypes.func, - selectedItemStyle: React.PropTypes.object, - value: React.PropTypes.any, - valueLink: deprecated(React.PropTypes.shape({ - value: React.PropTypes.any, - requestChange: React.PropTypes.func, + children: PropTypes.node, + onChange: PropTypes.func, + selectedItemStyle: PropTypes.object, + value: PropTypes.any, + valueLink: deprecated(PropTypes.shape({ + value: PropTypes.any, + requestChange: PropTypes.func, }), 'This property is deprecated due to his low popularity. Use the value and onChange property.'), }; static contextTypes = { - muiTheme: React.PropTypes.object.isRequired, + muiTheme: PropTypes.object.isRequired, }; getValueLink(props) { diff --git a/src/List/NestedList.js b/src/List/NestedList.js index b7de68bcf49f6d..bb184d2291cb44 100644 --- a/src/List/NestedList.js +++ b/src/List/NestedList.js @@ -1,16 +1,16 @@ -import React from 'react'; +import React, {Component, PropTypes} from 'react'; import List from './List'; -class NestedList extends React.Component { +class NestedList extends Component { static propTypes = { - children: React.PropTypes.node, - nestedLevel: React.PropTypes.number, - open: React.PropTypes.bool, + children: PropTypes.node, + nestedLevel: PropTypes.number, + open: PropTypes.bool, /** * Override the inline-styles of the root element. */ - style: React.PropTypes.object, + style: PropTypes.object, }; static defaultProps = { diff --git a/src/Menu/Menu.js b/src/Menu/Menu.js index ebbb9301508d26..2248b4e77badf7 100644 --- a/src/Menu/Menu.js +++ b/src/Menu/Menu.js @@ -1,4 +1,4 @@ -import React from 'react'; +import React, {Component, PropTypes} from 'react'; import ReactDOM from 'react-dom'; import update from 'react-addons-update'; import shallowEqual from 'recompose/shallowEqual'; @@ -63,14 +63,14 @@ function getStyles(props, context) { return styles; } -class Menu extends React.Component { +class Menu extends Component { static propTypes = { /** * If true, the menu will apply transitions when it * is added to the DOM. In order for transitions to * work, wrap the menu inside a `ReactTransitionGroup`. */ - animated: deprecated(React.PropTypes.bool, 'Instead, use a [Popover](/#/components/popover).'), + animated: deprecated(PropTypes.bool, 'Instead, use a [Popover](/#/components/popover).'), /** * If true, the width of the menu will be set automatically @@ -78,46 +78,46 @@ class Menu extends React.Component { * using proper keyline increments (64px for desktop, * 56px otherwise). */ - autoWidth: React.PropTypes.bool, + autoWidth: PropTypes.bool, /** * The content of the menu. This is usually used to pass `MenuItem` * elements. */ - children: React.PropTypes.node, + children: PropTypes.node, /** * If true, the menu item will render with compact desktop styles. */ - desktop: React.PropTypes.bool, + desktop: PropTypes.bool, /** * If true, the menu will not be auto-focused. */ - disableAutoFocus: React.PropTypes.bool, + disableAutoFocus: PropTypes.bool, /** * If true, the menu will be keyboard-focused initially. */ - initiallyKeyboardFocused: React.PropTypes.bool, + initiallyKeyboardFocused: PropTypes.bool, /** * Override the inline-styles of the underlying `List` element. */ - listStyle: React.PropTypes.object, + listStyle: PropTypes.object, /** * The maximum height of the menu in pixels. If specified, * the menu will be scrollable if it is taller than the provided * height. */ - maxHeight: React.PropTypes.number, + maxHeight: PropTypes.number, /** * If true, `value` must be an array and the menu will support * multiple selections. */ - multiple: React.PropTypes.bool, + multiple: PropTypes.bool, /** * Callback function fired when a menu item with `value` not @@ -129,7 +129,7 @@ class Menu extends React.Component { * it wasn't already selected) or omitted (if it was already selected). * Otherwise, the `value` of the menu item. */ - onChange: React.PropTypes.func, + onChange: PropTypes.func, /** * Callback function fired when the menu is focused and the *Esc* key @@ -137,7 +137,7 @@ class Menu extends React.Component { * * @param {object} event `keydown` event targeting the menu. */ - onEscKeyDown: React.PropTypes.func, + onEscKeyDown: PropTypes.func, /** * Callback function fired when a menu item is touch-tapped. @@ -146,7 +146,7 @@ class Menu extends React.Component { * @param {object} menuItem The menu item. * @param {number} index The index of the menu item. */ - onItemTouchTap: React.PropTypes.func, + onItemTouchTap: PropTypes.func, /** * Callback function fired when the menu is focused and a key @@ -154,7 +154,7 @@ class Menu extends React.Component { * * @param {object} event `keydown` event targeting the menu. */ - onKeyDown: React.PropTypes.func, + onKeyDown: PropTypes.func, /** * This is the placement of the menu relative to the `IconButton`. @@ -164,12 +164,12 @@ class Menu extends React.Component { /** * Override the inline-styles of selected menu items. */ - selectedMenuItemStyle: React.PropTypes.object, + selectedMenuItemStyle: PropTypes.object, /** * Override the inline-styles of the root element. */ - style: React.PropTypes.object, + style: PropTypes.object, /** * If `multiple` is true, an array of the `value`s of the selected @@ -177,12 +177,12 @@ class Menu extends React.Component { * If provided, the menu will be a controlled component. * This component also supports valueLink. */ - value: React.PropTypes.any, + value: PropTypes.any, /** * ValueLink for the menu's `value`. */ - valueLink: React.PropTypes.object, + valueLink: PropTypes.object, /** * The width of the menu. If not specified, the menu's width @@ -213,7 +213,7 @@ class Menu extends React.Component { }; static contextTypes = { - muiTheme: React.PropTypes.object.isRequired, + muiTheme: PropTypes.object.isRequired, }; constructor(props, context) { diff --git a/src/MenuItem/MenuItem.js b/src/MenuItem/MenuItem.js index 77ec2e599c7591..2088fed5737db1 100644 --- a/src/MenuItem/MenuItem.js +++ b/src/MenuItem/MenuItem.js @@ -1,4 +1,4 @@ -import React from 'react'; +import React, {Component, PropTypes} from 'react'; import ReactDOM from 'react-dom'; import shallowEqual from 'recompose/shallowEqual'; import Popover from '../Popover/Popover'; @@ -52,37 +52,37 @@ function getStyles(props, context) { return styles; } -class MenuItem extends React.Component { +class MenuItem extends Component { static muiName = 'MenuItem'; static propTypes = { /** * If true, a left check mark will be rendered. */ - checked: React.PropTypes.bool, + checked: PropTypes.bool, /** * Elements passed as children to the underlying `ListItem`. */ - children: React.PropTypes.node, + children: PropTypes.node, /** * @ignore * If true, the menu item will render with compact desktop * styles. */ - desktop: React.PropTypes.bool, + desktop: PropTypes.bool, /** * If true, the menu item will be disabled. */ - disabled: React.PropTypes.bool, + disabled: PropTypes.bool, /** * The focus state of the menu item. This prop is used to set the focus * state of the underlying `ListItem`. */ - focusState: React.PropTypes.oneOf([ + focusState: PropTypes.oneOf([ 'none', 'focused', 'keyboard-focused', @@ -91,55 +91,55 @@ class MenuItem extends React.Component { /** * Override the inline-styles of the inner div. */ - innerDivStyle: React.PropTypes.object, + innerDivStyle: PropTypes.object, /** * If true, the children will be indented. * This is only needed when there is no `leftIcon`. */ - insetChildren: React.PropTypes.bool, + insetChildren: PropTypes.bool, /** * The `SvgIcon` or `FontIcon` to be displayed on the left side. */ - leftIcon: React.PropTypes.element, + leftIcon: PropTypes.element, /** * `MenuItem` elements to nest within the menu item. */ - menuItems: React.PropTypes.node, + menuItems: PropTypes.node, /** * Callback function fired when the menu item is touch-tapped. * * @param {object} event TouchTap event targeting the menu item. */ - onTouchTap: React.PropTypes.func, + onTouchTap: PropTypes.func, /** * Can be used to render primary text within the menu item. */ - primaryText: React.PropTypes.node, + primaryText: PropTypes.node, /** * The `SvgIcon` or `FontIcon` to be displayed on the right side. */ - rightIcon: React.PropTypes.element, + rightIcon: PropTypes.element, /** * Can be used to render secondary text within the menu item. */ - secondaryText: React.PropTypes.node, + secondaryText: PropTypes.node, /** * Override the inline-styles of the root element. */ - style: React.PropTypes.object, + style: PropTypes.object, /** * The value of the menu item. */ - value: React.PropTypes.any, + value: PropTypes.any, }; static defaultProps = { @@ -151,7 +151,7 @@ class MenuItem extends React.Component { }; static contextTypes = { - muiTheme: React.PropTypes.object.isRequired, + muiTheme: PropTypes.object.isRequired, }; state = { diff --git a/src/Paper/Paper.js b/src/Paper/Paper.js index 4406789e3f1907..8c842f19df15e6 100644 --- a/src/Paper/Paper.js +++ b/src/Paper/Paper.js @@ -1,4 +1,4 @@ -import React from 'react'; +import React, {Component, PropTypes} from 'react'; import propTypes from '../utils/propTypes'; import transitions from '../styles/transitions'; @@ -29,33 +29,33 @@ function getStyles(props, context) { }; } -class Paper extends React.Component { +class Paper extends Component { static propTypes = { /** * Children passed into the paper element. */ - children: React.PropTypes.node, + children: PropTypes.node, /** * Set to true to generate a circlular paper container. */ - circle: React.PropTypes.bool, + circle: PropTypes.bool, /** * By default, the paper container will have a border radius. * Set this to false to generate a container with sharp corners. */ - rounded: React.PropTypes.bool, + rounded: PropTypes.bool, /** * Override the inline-styles of the root element. */ - style: React.PropTypes.object, + style: PropTypes.object, /** * Set to false to disable CSS transitions for the paper element. */ - transitionEnabled: React.PropTypes.bool, + transitionEnabled: PropTypes.bool, /** * This number represents the zDepth of the paper shadow. @@ -71,7 +71,7 @@ class Paper extends React.Component { }; static contextTypes = { - muiTheme: React.PropTypes.object.isRequired, + muiTheme: PropTypes.object.isRequired, }; render() { diff --git a/src/Popover/Popover.js b/src/Popover/Popover.js index da16dd516b650f..47ea49cb10e126 100644 --- a/src/Popover/Popover.js +++ b/src/Popover/Popover.js @@ -1,4 +1,4 @@ -import React from 'react'; +import React, {Component, PropTypes} from 'react'; import ReactDOM from 'react-dom'; import EventListener from 'react-event-listener'; import RenderToLayer from '../internal/RenderToLayer'; @@ -7,13 +7,13 @@ import Paper from '../Paper'; import throttle from 'lodash.throttle'; import PopoverAnimationDefault from './PopoverAnimationDefault'; -class Popover extends React.Component { +class Popover extends Component { static propTypes = { /** * This is the DOM element that will be used to set the position of the * popover. */ - anchorEl: React.PropTypes.object, + anchorEl: PropTypes.object, /** * This is the point on the anchor where the popover's @@ -28,34 +28,34 @@ class Popover extends React.Component { * If true, the popover will apply transitions when * it is added to the DOM. */ - animated: React.PropTypes.bool, + animated: PropTypes.bool, /** * Override the default animation component used. */ - animation: React.PropTypes.func, + animation: PropTypes.func, /** * If true, the popover will hide when the anchor is scrolled off the screen. */ - autoCloseWhenOffScreen: React.PropTypes.bool, + autoCloseWhenOffScreen: PropTypes.bool, /** * If true, the popover (potentially) ignores `targetOrigin` * and `anchorOrigin` to make itself fit on screen, * which is useful for mobile devices. */ - canAutoPosition: React.PropTypes.bool, + canAutoPosition: PropTypes.bool, /** * The content of the popover. */ - children: React.PropTypes.node, + children: PropTypes.node, /** * The CSS class name of the root element. */ - className: React.PropTypes.string, + className: PropTypes.string, /** * Callback function fired when the popover is requested to be closed. @@ -63,17 +63,17 @@ class Popover extends React.Component { * @param {string} reason The reason for the close request. Possibles values * are 'clickAway' and 'offScreen'. */ - onRequestClose: React.PropTypes.func, + onRequestClose: PropTypes.func, /** * If true, the popover is visible. */ - open: React.PropTypes.bool, + open: PropTypes.bool, /** * Override the inline-styles of the root element. */ - style: React.PropTypes.object, + style: PropTypes.object, /** * This is the point on the popover which will attach to @@ -89,7 +89,7 @@ class Popover extends React.Component { * layer, which will prevent clicks to the underlying * elements, and trigger an `onRequestClose('clickAway')` call. */ - useLayerForClickAway: React.PropTypes.bool, + useLayerForClickAway: PropTypes.bool, /** * The zDepth of the popover. @@ -119,7 +119,7 @@ class Popover extends React.Component { }; static contextTypes = { - muiTheme: React.PropTypes.object.isRequired, + muiTheme: PropTypes.object.isRequired, }; constructor(props, context) { diff --git a/src/Popover/PopoverAnimationDefault.js b/src/Popover/PopoverAnimationDefault.js index ff76cd49c1d221..f6e8775a8157c2 100644 --- a/src/Popover/PopoverAnimationDefault.js +++ b/src/Popover/PopoverAnimationDefault.js @@ -1,5 +1,5 @@ import transitions from '../styles/transitions'; -import React from 'react'; +import React, {Component, PropTypes} from 'react'; import propTypes from '../utils/propTypes'; import Paper from '../Paper'; @@ -36,20 +36,20 @@ function getStyles(props, context, state) { }; } -class PopoverDefaultAnimation extends React.Component { +class PopoverDefaultAnimation extends Component { static propTypes = { - children: React.PropTypes.node, + children: PropTypes.node, /** * The css class name of the root element. */ - className: React.PropTypes.string, - open: React.PropTypes.bool.isRequired, + className: PropTypes.string, + open: PropTypes.bool.isRequired, /** * Override the inline-styles of the root element. */ - style: React.PropTypes.object, + style: PropTypes.object, targetOrigin: propTypes.origin, zDepth: propTypes.zDepth, }; @@ -60,7 +60,7 @@ class PopoverDefaultAnimation extends React.Component { }; static contextTypes = { - muiTheme: React.PropTypes.object.isRequired, + muiTheme: PropTypes.object.isRequired, }; state = { diff --git a/src/Popover/PopoverAnimationVertical.js b/src/Popover/PopoverAnimationVertical.js index 456bcdd8e8549b..288c29b6c06c8b 100644 --- a/src/Popover/PopoverAnimationVertical.js +++ b/src/Popover/PopoverAnimationVertical.js @@ -1,4 +1,4 @@ -import React from 'react'; +import React, {Component, PropTypes} from 'react'; import Paper from '../Paper'; import transitions from '../styles/transitions'; import propTypes from '../utils/propTypes'; @@ -22,16 +22,16 @@ function getStyles(props, context, state) { }; } -class PopoverAnimationVertical extends React.Component { +class PopoverAnimationVertical extends Component { static propTypes = { - children: React.PropTypes.node, - className: React.PropTypes.string, - open: React.PropTypes.bool.isRequired, + children: PropTypes.node, + className: PropTypes.string, + open: PropTypes.bool.isRequired, /** * Override the inline-styles of the root element. */ - style: React.PropTypes.object, + style: PropTypes.object, targetOrigin: propTypes.origin, zDepth: propTypes.zDepth, }; @@ -42,7 +42,7 @@ class PopoverAnimationVertical extends React.Component { }; static contextTypes = { - muiTheme: React.PropTypes.object.isRequired, + muiTheme: PropTypes.object.isRequired, }; state = { diff --git a/src/RadioButton/RadioButton.js b/src/RadioButton/RadioButton.js index 8b268573cc9c62..521f4a8dfea60b 100644 --- a/src/RadioButton/RadioButton.js +++ b/src/RadioButton/RadioButton.js @@ -1,4 +1,4 @@ -import React from 'react'; +import React, {Component, PropTypes} from 'react'; import transitions from '../styles/transitions'; import EnhancedSwitch from '../internal/EnhancedSwitch'; import RadioButtonOff from '../svg-icons/toggle/radio-button-unchecked'; @@ -50,46 +50,46 @@ function getStyles(props, context) { }; } -class RadioButton extends React.Component { +class RadioButton extends Component { static propTypes = { /** * @ignore * checked if true * Used internally by `RadioButtonGroup`. */ - checked: React.PropTypes.bool, + checked: PropTypes.bool, /** * The icon element to show when the radio button is checked. */ - checkedIcon: React.PropTypes.element, + checkedIcon: PropTypes.element, /** * If true, the radio button is disabled. */ - disabled: React.PropTypes.bool, + disabled: PropTypes.bool, /** * Override the inline-styles of the icon element. */ - iconStyle: React.PropTypes.object, + iconStyle: PropTypes.object, /** * Override the inline-styles of the input element. */ - inputStyle: React.PropTypes.object, + inputStyle: PropTypes.object, /** * @ignore * Used internally by `RadioButtonGroup`. Use the `labelPosition` property of `RadioButtonGroup` instead. * Where the label will be placed next to the radio button. */ - labelPosition: React.PropTypes.oneOf(['left', 'right']), + labelPosition: PropTypes.oneOf(['left', 'right']), /** * Override the inline-styles of the label element. */ - labelStyle: React.PropTypes.object, + labelStyle: PropTypes.object, /** * @ignore @@ -101,22 +101,22 @@ class RadioButton extends React.Component { * @param {object} event `change` event targeting the element. * @param {string} value The element's `value`. */ - onCheck: React.PropTypes.func, + onCheck: PropTypes.func, /** * Override the inline-styles of the root element. */ - style: React.PropTypes.object, + style: PropTypes.object, /** * The icon element to show when the radio button is unchecked. */ - uncheckedIcon: React.PropTypes.element, + uncheckedIcon: PropTypes.element, /** * The value of the radio button. */ - value: React.PropTypes.string, + value: PropTypes.string, }; static defaultProps = { @@ -126,7 +126,7 @@ class RadioButton extends React.Component { }; static contextTypes = { - muiTheme: React.PropTypes.object.isRequired, + muiTheme: PropTypes.object.isRequired, }; handleStateChange = () => { diff --git a/src/RadioButton/RadioButtonGroup.js b/src/RadioButton/RadioButtonGroup.js index 0556bb13e5ac7e..665148a4e80f00 100644 --- a/src/RadioButton/RadioButtonGroup.js +++ b/src/RadioButton/RadioButtonGroup.js @@ -1,37 +1,37 @@ -import React from 'react'; +import React, {Component, PropTypes} from 'react'; import RadioButton from '../RadioButton'; import warning from 'warning'; -class RadioButtonGroup extends React.Component { +class RadioButtonGroup extends Component { static propTypes = { /** * Should be used to pass `RadioButton` components. */ - children: React.PropTypes.node, + children: PropTypes.node, /** * The CSS class name of the root element. */ - className: React.PropTypes.string, + className: PropTypes.string, /** * The `value` property (case-sensitive) of the radio button that will be * selected by default. This takes precedence over the `checked` property * of the `RadioButton` elements. */ - defaultSelected: React.PropTypes.string, + defaultSelected: PropTypes.string, /** * Where the label will be placed for all child radio buttons. * This takes precedence over the `labelPosition` property of the * `RadioButton` elements. */ - labelPosition: React.PropTypes.oneOf(['left', 'right']), + labelPosition: PropTypes.oneOf(['left', 'right']), /** * The name that will be applied to all child radio buttons. */ - name: React.PropTypes.string.isRequired, + name: PropTypes.string.isRequired, /** * Callback function that is fired when a radio button has @@ -41,17 +41,17 @@ class RadioButtonGroup extends React.Component { * radio button. * @param {string} value The `value` of the selected radio button. */ - onChange: React.PropTypes.func, + onChange: PropTypes.func, /** * Override the inline-styles of the root element. */ - style: React.PropTypes.object, + style: PropTypes.object, /** * The `value` of the currently selected radio button. */ - valueSelected: React.PropTypes.string, + valueSelected: PropTypes.string, }; static defaultProps = { @@ -59,7 +59,7 @@ class RadioButtonGroup extends React.Component { }; static contextTypes = { - muiTheme: React.PropTypes.object.isRequired, + muiTheme: PropTypes.object.isRequired, }; state = { diff --git a/src/RaisedButton/RaisedButton.js b/src/RaisedButton/RaisedButton.js index 2a43b75d2c2806..ed5416854aca8a 100644 --- a/src/RaisedButton/RaisedButton.js +++ b/src/RaisedButton/RaisedButton.js @@ -1,4 +1,4 @@ -import React from 'react'; +import React, {Component, PropTypes} from 'react'; import transitions from '../styles/transitions'; import {fade} from '../utils/colorManipulator'; import {createChildFragment} from '../utils/childUtils'; @@ -107,7 +107,7 @@ function getStyles(props, context, state) { }; } -class RaisedButton extends React.Component { +class RaisedButton extends Component { static muiName = 'RaisedButton'; static propTypes = { @@ -116,51 +116,51 @@ class RaisedButton extends React.Component { * but not the default disabled background color * (use `disabledBackgroundColor` for this). */ - backgroundColor: React.PropTypes.string, + backgroundColor: PropTypes.string, /** * The content of the button. * If a label is provided via the `label` prop, the text within the label * will be displayed in addition to the content provided here. */ - children: React.PropTypes.node, + children: PropTypes.node, /** * The CSS class name of the root element. */ - className: React.PropTypes.string, + className: PropTypes.string, /** * If true, the button will be disabled. */ - disabled: React.PropTypes.bool, + disabled: PropTypes.bool, /** * Override the default background color for the button * when it is disabled. */ - disabledBackgroundColor: React.PropTypes.string, + disabledBackgroundColor: PropTypes.string, /** * The color of the button's label when the button is disabled. */ - disabledLabelColor: React.PropTypes.string, + disabledLabelColor: PropTypes.string, /** * If true, the button will take up the full width of its container. */ - fullWidth: React.PropTypes.bool, + fullWidth: PropTypes.bool, /** * If `linkButton` is true, the URL to link to when the button * is clicked. */ - href: React.PropTypes.string, + href: PropTypes.string, /** * An icon to be displayed within the button. */ - icon: React.PropTypes.node, + icon: PropTypes.node, /** * The label to be displayed within the button. @@ -172,12 +172,12 @@ class RaisedButton extends React.Component { /** * The color of the button's label. */ - labelColor: React.PropTypes.string, + labelColor: PropTypes.string, /** * The position of the button's label relative to the button's `children`. */ - labelPosition: React.PropTypes.oneOf([ + labelPosition: PropTypes.oneOf([ 'before', 'after', ]), @@ -185,13 +185,13 @@ class RaisedButton extends React.Component { /** * Override the inline-styles of the button's label element. */ - labelStyle: React.PropTypes.object, + labelStyle: PropTypes.object, /** * If true, enable the use of the `href` property to provide * a URL to link to. */ - linkButton: React.PropTypes.bool, + linkButton: PropTypes.bool, /** * Callback function fired when a mouse button is pressed down on @@ -199,64 +199,64 @@ class RaisedButton extends React.Component { * * @param {object} event `mousedown` event targeting the element. */ - onMouseDown: React.PropTypes.func, + onMouseDown: PropTypes.func, /** * Callback function fired when the mouse enters the element. * * @param {object} event `mouseenter` event targeting the element. */ - onMouseEnter: React.PropTypes.func, + onMouseEnter: PropTypes.func, /** * Callback function fired when the mouse leaves the element. * * @param {object} event `mouseleave` event targeting the element. */ - onMouseLeave: React.PropTypes.func, + onMouseLeave: PropTypes.func, /** * Callback function fired when a mouse button is released on the element. * * @param {object} event `mouseup` event targeting the element. */ - onMouseUp: React.PropTypes.func, + onMouseUp: PropTypes.func, /** * Callback function fired when a touch point is removed from the element. * * @param {object} event `touchend` event targeting the element. */ - onTouchEnd: React.PropTypes.func, + onTouchEnd: PropTypes.func, /** * Callback function fired when the element is touched. * * @param {object} event `touchstart` event targeting the element. */ - onTouchStart: React.PropTypes.func, + onTouchStart: PropTypes.func, /** * If true, the button will use the theme's primary color. */ - primary: React.PropTypes.bool, + primary: PropTypes.bool, /** * Override the inline style of the ripple element. */ - rippleStyle: React.PropTypes.object, + rippleStyle: PropTypes.object, /** * If true, the button will use the theme's secondary color. * If both `secondary` and `primary` are true, the button will use * the theme's primary color. */ - secondary: React.PropTypes.bool, + secondary: PropTypes.bool, /** * Override the inline-styles of the root element. */ - style: React.PropTypes.object, + style: PropTypes.object, }; static defaultProps = { @@ -268,7 +268,7 @@ class RaisedButton extends React.Component { }; static contextTypes = { - muiTheme: React.PropTypes.object.isRequired, + muiTheme: PropTypes.object.isRequired, }; state = { diff --git a/src/RefreshIndicator/RefreshIndicator.js b/src/RefreshIndicator/RefreshIndicator.js index 08faef99adcce0..ee2ca4935c28e4 100644 --- a/src/RefreshIndicator/RefreshIndicator.js +++ b/src/RefreshIndicator/RefreshIndicator.js @@ -1,4 +1,4 @@ -import React from 'react'; +import React, {Component, PropTypes} from 'react'; import autoPrefix from '../utils/autoPrefix'; import transitions from '../styles/transitions'; import Paper from '../Paper'; @@ -23,34 +23,34 @@ function getStyles(props) { }; } -class RefreshIndicator extends React.Component { +class RefreshIndicator extends Component { static propTypes = { /** * Override the theme's color of the indicator while it's status is * "ready" and it's percentage is less than 100. */ - color: React.PropTypes.string, + color: PropTypes.string, /** * The absolute left position of the indicator in pixels. */ - left: React.PropTypes.number.isRequired, + left: PropTypes.number.isRequired, /** * Override the theme's color of the indicator while * it's status is "loading" or when it's percentage is 100. */ - loadingColor: React.PropTypes.string, + loadingColor: PropTypes.string, /** * The confirmation progress to fetch data. Max value is 100. */ - percentage: React.PropTypes.number, + percentage: PropTypes.number, /** * Size in pixels. */ - size: React.PropTypes.number, + size: PropTypes.number, /** * The display status of the indicator. If the status is @@ -59,17 +59,17 @@ class RefreshIndicator extends React.Component { * the loading progress indicator. If the status is "hide", * the indicator will be hidden. */ - status: React.PropTypes.oneOf(['ready', 'loading', 'hide']), + status: PropTypes.oneOf(['ready', 'loading', 'hide']), /** * Override the inline-styles of the root element. */ - style: React.PropTypes.object, + style: PropTypes.object, /** * The absolute top position of the indicator in pixels. */ - top: React.PropTypes.number.isRequired, + top: PropTypes.number.isRequired, }; static defaultProps = { @@ -79,7 +79,7 @@ class RefreshIndicator extends React.Component { }; static contextTypes = { - muiTheme: React.PropTypes.object.isRequired, + muiTheme: PropTypes.object.isRequired, }; componentDidMount() { diff --git a/src/SelectField/SelectField.js b/src/SelectField/SelectField.js index a7bc6358615496..41c6e9dad82965 100644 --- a/src/SelectField/SelectField.js +++ b/src/SelectField/SelectField.js @@ -1,4 +1,4 @@ -import React from 'react'; +import React, {Component, PropTypes} from 'react'; import TextField from '../TextField'; import DropDownMenu from '../DropDownMenu'; @@ -18,14 +18,14 @@ function getStyles(props) { }; } -class SelectField extends React.Component { +class SelectField extends Component { static propTypes = { /** * If true, the width will automatically be set according to the * items inside the menu. * To control this width in css instead, leave this prop to `false`. */ - autoWidth: React.PropTypes.bool, + autoWidth: PropTypes.bool, /** * The `MenuItem` elements to populate the `Menu` with. @@ -33,107 +33,107 @@ class SelectField extends React.Component { * be used to render the representation of that * item within the field. */ - children: React.PropTypes.node, + children: PropTypes.node, /** * Disables the select field if set to true. */ - disabled: React.PropTypes.bool, + disabled: PropTypes.bool, /** * The style object to use to override error styles. */ - errorStyle: React.PropTypes.object, + errorStyle: PropTypes.object, /** * The error content to display. */ - errorText: React.PropTypes.node, + errorText: PropTypes.node, /** * The style object to use to override floating label styles. */ - floatingLabelStyle: React.PropTypes.object, + floatingLabelStyle: PropTypes.object, /** * The content to use for the floating label element. */ - floatingLabelText: React.PropTypes.node, + floatingLabelText: PropTypes.node, /** * If true, the field receives the property width 100%. */ - fullWidth: React.PropTypes.bool, + fullWidth: PropTypes.bool, /** * The style object to use to override hint styles. */ - hintStyle: React.PropTypes.object, + hintStyle: PropTypes.object, /** * The hint content to display. */ - hintText: React.PropTypes.node, + hintText: PropTypes.node, /** * Overrides the styles of the icon element. */ - iconStyle: React.PropTypes.object, + iconStyle: PropTypes.object, /** * The id prop for the text field. */ - id: React.PropTypes.string, + id: PropTypes.string, /** * Overrides the styles of label when the `SelectField` is inactive. */ - labelStyle: React.PropTypes.object, + labelStyle: PropTypes.object, /** * Callback function that is fired when the `SelectField` loses focus. */ - onBlur: React.PropTypes.func, + onBlur: PropTypes.func, /** * Callback function that is fired when the value changes. */ - onChange: React.PropTypes.func, + onChange: PropTypes.func, /** * Callback function that is fired when the `SelectField` gains focus. */ - onFocus: React.PropTypes.func, + onFocus: PropTypes.func, /** * The style object to use to override the `DropDownMenu`. */ - selectFieldRoot: React.PropTypes.object, // Must be changed! + selectFieldRoot: PropTypes.object, // Must be changed! /** * Override the inline-styles of the root element. */ - style: React.PropTypes.object, + style: PropTypes.object, /** * Override the inline-styles of the underline element when disabled. */ - underlineDisabledStyle: React.PropTypes.object, + underlineDisabledStyle: PropTypes.object, /** * Override the inline-styles of the underline element when focused. */ - underlineFocusStyle: React.PropTypes.object, + underlineFocusStyle: PropTypes.object, /** * Overrides the styles of the underline element. */ - underlineStyle: React.PropTypes.object, + underlineStyle: PropTypes.object, /** * The value that is currently selected. */ - value: React.PropTypes.any, + value: PropTypes.any, }; static defaultProps = { @@ -143,7 +143,7 @@ class SelectField extends React.Component { }; static contextTypes = { - muiTheme: React.PropTypes.object.isRequired, + muiTheme: PropTypes.object.isRequired, }; render() { diff --git a/src/Slider/Slider.js b/src/Slider/Slider.js index 2574dccf6686b6..2ea1c9a12d4c66 100644 --- a/src/Slider/Slider.js +++ b/src/Slider/Slider.js @@ -1,4 +1,4 @@ -import React from 'react'; +import React, {Component, PropTypes} from 'react'; import keycode from 'keycode'; import transitions from '../styles/transitions'; import FocusRipple from '../internal/FocusRipple'; @@ -11,7 +11,7 @@ import FocusRipple from '../internal/FocusRipple'; * @returns {Object} Returns an Error if min >= max otherwise null. */ const minMaxPropType = (props, propName, componentName) => { - const error = React.PropTypes.number(props, propName, componentName); + const error = PropTypes.number(props, propName, componentName); if (error !== null) return error; if (props.min >= props.max) { @@ -28,7 +28,7 @@ const minMaxPropType = (props, propName, componentName) => { * @returns {Object} Returns an Error if the value is not within the range otherwise null. */ const valueInRangePropType = (props, propName, componentName) => { - const error = React.PropTypes.number(props, propName, componentName); + const error = PropTypes.number(props, propName, componentName); if (error !== null) return error; const value = props[propName]; @@ -151,7 +151,7 @@ const getStyles = (props, context, state) => { return styles; }; -class Slider extends React.Component { +class Slider extends Component { static propTypes = { /** * The default value of the slider. @@ -161,22 +161,22 @@ class Slider extends React.Component { /** * Describe the slider. */ - description: React.PropTypes.string, + description: PropTypes.string, /** * Disables focus ripple if set to true. */ - disableFocusRipple: React.PropTypes.bool, + disableFocusRipple: PropTypes.bool, /** * If true, the slider will not be interactable. */ - disabled: React.PropTypes.bool, + disabled: PropTypes.bool, /** * An error message for the slider. */ - error: React.PropTypes.string, + error: PropTypes.string, /** * The maximum value the slider can slide to on @@ -194,47 +194,47 @@ class Slider extends React.Component { * The name of the slider. Behaves like the name attribute * of an input element. */ - name: React.PropTypes.string, + name: PropTypes.string, /** * Callback function that is fired when the focus has left the slider. */ - onBlur: React.PropTypes.func, + onBlur: PropTypes.func, /** * Callback function that is fired when the user changes the slider's value. */ - onChange: React.PropTypes.func, + onChange: PropTypes.func, /** * Callback function that is fired when the slider has begun to move. */ - onDragStart: React.PropTypes.func, + onDragStart: PropTypes.func, /** * Callback function that is fried when the slide has stopped moving. */ - onDragStop: React.PropTypes.func, + onDragStop: PropTypes.func, /** * Callback fired when the user has focused on the slider. */ - onFocus: React.PropTypes.func, + onFocus: PropTypes.func, /** * Whether or not the slider is required in a form. */ - required: React.PropTypes.bool, + required: PropTypes.bool, /** * The granularity the slider can step through values. */ - step: React.PropTypes.number, + step: PropTypes.number, /** * Override the inline-styles of the root element. */ - style: React.PropTypes.object, + style: PropTypes.object, /** * The value of the slider. @@ -253,7 +253,7 @@ class Slider extends React.Component { }; static contextTypes = { - muiTheme: React.PropTypes.object.isRequired, + muiTheme: PropTypes.object.isRequired, }; state = { diff --git a/src/Snackbar/Snackbar.js b/src/Snackbar/Snackbar.js index 31abbd4f132d66..d98acac989fe8b 100644 --- a/src/Snackbar/Snackbar.js +++ b/src/Snackbar/Snackbar.js @@ -1,4 +1,4 @@ -import React from 'react'; +import React, {PropTypes} from 'react'; import transitions from '../styles/transitions'; import ClickAwayListener from '../internal/ClickAwayListener'; import FlatButton from '../FlatButton'; @@ -71,7 +71,7 @@ const Snackbar = React.createClass({ /** * The label for the action on the snackbar. */ - action: React.PropTypes.string, + action: PropTypes.string, /** * The number of milliseconds to wait before automatically dismissing. @@ -79,17 +79,17 @@ const Snackbar = React.createClass({ * If a value is provided the snackbar can still be dismissed normally. * If a snackbar is dismissed before the timer expires, the timer will be cleared. */ - autoHideDuration: React.PropTypes.number, + autoHideDuration: PropTypes.number, /** * Override the inline-styles of the body element. */ - bodyStyle: React.PropTypes.object, + bodyStyle: PropTypes.object, /** * The css class name of the root element. */ - className: React.PropTypes.string, + className: PropTypes.string, /** * The message to be displayed. @@ -98,14 +98,14 @@ const Snackbar = React.createClass({ * ensure that the same object remains as the `message` property if you want to avoid the `Snackbar` hiding and * showing again) */ - message: React.PropTypes.node.isRequired, + message: PropTypes.node.isRequired, /** * Fired when the action button is touchtapped. * * @param {object} event Action button event. */ - onActionTouchTap: React.PropTypes.func, + onActionTouchTap: PropTypes.func, /** * Fired when the `Snackbar` is requested to be closed by a click outside the `Snackbar`, or after the @@ -119,21 +119,21 @@ const Snackbar = React.createClass({ * * @param {string} reason Can be:`"timeout"` (`autoHideDuration` expired) or: `"clickaway"` */ - onRequestClose: React.PropTypes.func, + onRequestClose: PropTypes.func, /** * Controls whether the `Snackbar` is opened or not. */ - open: React.PropTypes.bool.isRequired, + open: PropTypes.bool.isRequired, /** * Override the inline-styles of the root element. */ - style: React.PropTypes.object, + style: PropTypes.object, }, contextTypes: { - muiTheme: React.PropTypes.object.isRequired, + muiTheme: PropTypes.object.isRequired, }, mixins: [ diff --git a/src/Stepper/Step.js b/src/Stepper/Step.js index 0b062e368e7336..139ff42737fcde 100644 --- a/src/Stepper/Step.js +++ b/src/Stepper/Step.js @@ -1,4 +1,4 @@ -import React, {PropTypes} from 'react'; +import React, {Component, PropTypes} from 'react'; const getStyles = ({index}, {stepper}) => { const {orientation} = stepper; @@ -19,7 +19,7 @@ const getStyles = ({index}, {stepper}) => { return styles; }; -export default class Step extends React.Component { +export default class Step extends Component { static propTypes = { /** diff --git a/src/Stepper/StepButton.js b/src/Stepper/StepButton.js index 0c50b3d6baeafa..b9679c12a041c7 100644 --- a/src/Stepper/StepButton.js +++ b/src/Stepper/StepButton.js @@ -1,4 +1,4 @@ -import React, {PropTypes} from 'react'; +import React, {Component, PropTypes} from 'react'; import transitions from '../styles/transitions'; import EnhancedButton from '../internal/EnhancedButton'; import StepLabel from './StepLabel'; @@ -26,7 +26,7 @@ const getStyles = (props, context, state) => { return styles; }; -class StepButton extends React.Component { +class StepButton extends Component { static propTypes = { /** diff --git a/src/Stepper/StepContent.js b/src/Stepper/StepContent.js index fce58b1d043d48..0a386ac4174f7e 100644 --- a/src/Stepper/StepContent.js +++ b/src/Stepper/StepContent.js @@ -1,4 +1,4 @@ -import React, {PropTypes} from 'react'; +import React, {Component, PropTypes} from 'react'; import ExpandTransition from '../internal/ExpandTransition'; import warning from 'warning'; @@ -20,7 +20,7 @@ const getStyles = (props, context) => { return styles; }; -class StepContent extends React.Component { +class StepContent extends Component { static propTypes = { /** * Expands the content diff --git a/src/Stepper/StepLabel.js b/src/Stepper/StepLabel.js index 566c471f39cdd8..b38ab43c328b30 100644 --- a/src/Stepper/StepLabel.js +++ b/src/Stepper/StepLabel.js @@ -1,4 +1,4 @@ -import React, {PropTypes} from 'react'; +import React, {Component, PropTypes} from 'react'; import CheckCircle from '../svg-icons/action/check-circle'; import SvgIcon from '../SvgIcon'; @@ -52,7 +52,7 @@ const getStyles = ({active, completed, disabled}, {muiTheme, stepper}) => { return styles; }; -class StepLabel extends React.Component { +class StepLabel extends Component { static muiName = 'StepLabel'; static propTypes = { diff --git a/src/Stepper/Stepper.js b/src/Stepper/Stepper.js index 2462331fd91047..60fa45e1d5b697 100644 --- a/src/Stepper/Stepper.js +++ b/src/Stepper/Stepper.js @@ -1,4 +1,4 @@ -import React, {PropTypes} from 'react'; +import React, {Component, PropTypes} from 'react'; import StepConnector from './StepConnector'; const getStyles = (props) => { @@ -14,7 +14,7 @@ const getStyles = (props) => { }; }; -class Stepper extends React.Component { +class Stepper extends Component { static propTypes = { /** diff --git a/src/Subheader/Subheader.js b/src/Subheader/Subheader.js index e7b7aa0897493b..e6bd3fdf4d720b 100644 --- a/src/Subheader/Subheader.js +++ b/src/Subheader/Subheader.js @@ -1,20 +1,20 @@ -import React from 'react'; +import React, {PropTypes} from 'react'; const propTypes = { /** * Node that will be placed inside the `Subheader`. */ - children: React.PropTypes.node, + children: PropTypes.node, /** * If true, the `Subheader` will be indented by `72px`. */ - inset: React.PropTypes.bool, + inset: PropTypes.bool, /** * Override the inline-styles of the root element. */ - style: React.PropTypes.object, + style: PropTypes.object, }; const defaultProps = { @@ -22,7 +22,7 @@ const defaultProps = { }; const contextTypes = { - muiTheme: React.PropTypes.object.isRequired, + muiTheme: PropTypes.object.isRequired, }; const Subheader = (props, context) => { diff --git a/src/SvgIcon/SvgIcon.js b/src/SvgIcon/SvgIcon.js index da33cd1c744187..fd1fcd29a3715c 100644 --- a/src/SvgIcon/SvgIcon.js +++ b/src/SvgIcon/SvgIcon.js @@ -1,41 +1,41 @@ -import React from 'react'; +import React, {Component, PropTypes} from 'react'; import transitions from '../styles/transitions'; -class SvgIcon extends React.Component { +class SvgIcon extends Component { static muiName = 'SvgIcon'; static propTypes = { /** * Elements passed into the SVG Icon. */ - children: React.PropTypes.node, + children: PropTypes.node, /** * This is the fill color of the svg icon. * If not specified, this component will default * to muiTheme.palette.textColor. */ - color: React.PropTypes.string, + color: PropTypes.string, /** * This is the icon color when the mouse hovers over the icon. */ - hoverColor: React.PropTypes.string, + hoverColor: PropTypes.string, /** * Function called when mouse enters this element. */ - onMouseEnter: React.PropTypes.func, + onMouseEnter: PropTypes.func, /** * Function called when mouse leaves this element. */ - onMouseLeave: React.PropTypes.func, + onMouseLeave: PropTypes.func, /** * Override the inline-styles of the root element. */ - style: React.PropTypes.object, + style: PropTypes.object, /** * Allows you to redifine what the coordinates @@ -45,7 +45,7 @@ class SvgIcon extends React.Component { * the svg will go from the top left corner (0,0) to bottom right (50,20) * and each unit will be worth 10px. */ - viewBox: React.PropTypes.string, + viewBox: PropTypes.string, }; static defaultProps = { @@ -55,7 +55,7 @@ class SvgIcon extends React.Component { }; static contextTypes = { - muiTheme: React.PropTypes.object.isRequired, + muiTheme: PropTypes.object.isRequired, }; state = { diff --git a/src/Table/Table.js b/src/Table/Table.js index 7e5b760323d654..0859c5d13b9e31 100644 --- a/src/Table/Table.js +++ b/src/Table/Table.js @@ -1,4 +1,4 @@ -import React from 'react'; +import React, {Component, PropTypes} from 'react'; function getStyles(props, context) { const { @@ -28,94 +28,94 @@ function getStyles(props, context) { }; } -class Table extends React.Component { +class Table extends Component { static propTypes = { /** * Set to true to indicate that all rows should be selected. */ - allRowsSelected: React.PropTypes.bool, + allRowsSelected: PropTypes.bool, /** * Override the inline-styles of the body's table element. */ - bodyStyle: React.PropTypes.object, + bodyStyle: PropTypes.object, /** * Children passed to table. */ - children: React.PropTypes.node, + children: PropTypes.node, /** * The css class name of the root element. */ - className: React.PropTypes.string, + className: PropTypes.string, /** * If true, the footer will appear fixed below the table. * The default value is true. */ - fixedFooter: React.PropTypes.bool, + fixedFooter: PropTypes.bool, /** * If true, the header will appear fixed above the table. * The default value is true. */ - fixedHeader: React.PropTypes.bool, + fixedHeader: PropTypes.bool, /** * Override the inline-styles of the footer's table element. */ - footerStyle: React.PropTypes.object, + footerStyle: PropTypes.object, /** * Override the inline-styles of the header's table element. */ - headerStyle: React.PropTypes.object, + headerStyle: PropTypes.object, /** * The height of the table. */ - height: React.PropTypes.string, + height: PropTypes.string, /** * If true, multiple table rows can be selected. * CTRL/CMD+Click and SHIFT+Click are valid actions. * The default value is false. */ - multiSelectable: React.PropTypes.bool, + multiSelectable: PropTypes.bool, /** * Called when a row cell is clicked. * rowNumber is the row number and columnId is * the column number or the column key. */ - onCellClick: React.PropTypes.func, + onCellClick: PropTypes.func, /** * Called when a table cell is hovered. * rowNumber is the row number of the hovered row * and columnId is the column number or the column key of the cell. */ - onCellHover: React.PropTypes.func, + onCellHover: PropTypes.func, /** * Called when a table cell is no longer hovered. * rowNumber is the row number of the row and columnId * is the column number or the column key of the cell. */ - onCellHoverExit: React.PropTypes.func, + onCellHoverExit: PropTypes.func, /** * Called when a table row is hovered. * rowNumber is the row number of the hovered row. */ - onRowHover: React.PropTypes.func, + onRowHover: PropTypes.func, /** * Called when a table row is no longer hovered. * rowNumber is the row number of the row that is no longer hovered. */ - onRowHoverExit: React.PropTypes.func, + onRowHoverExit: PropTypes.func, /** * Called when a row is selected. @@ -123,24 +123,24 @@ class Table extends React.Component { * IF all rows have been selected, the string "all" * will be returned instead to indicate that all rows have been selected. */ - onRowSelection: React.PropTypes.func, + onRowSelection: PropTypes.func, /** * If true, table rows can be selected. * If multiple row selection is desired, enable multiSelectable. * The default value is true. */ - selectable: React.PropTypes.bool, + selectable: PropTypes.bool, /** * Override the inline-styles of the root element. */ - style: React.PropTypes.object, + style: PropTypes.object, /** * Override the inline-styles of the table's wrapper element. */ - wrapperStyle: React.PropTypes.object, + wrapperStyle: PropTypes.object, }; static defaultProps = { @@ -153,7 +153,7 @@ class Table extends React.Component { }; static contextTypes = { - muiTheme: React.PropTypes.object.isRequired, + muiTheme: PropTypes.object.isRequired, }; state = { diff --git a/src/Table/TableBody.js b/src/Table/TableBody.js index 8e4e074149eb56..163bdee17311f0 100644 --- a/src/Table/TableBody.js +++ b/src/Table/TableBody.js @@ -1,9 +1,9 @@ -import React from 'react'; +import React, {Component, PropTypes} from 'react'; import Checkbox from '../Checkbox'; import TableRowColumn from './TableRowColumn'; import ClickAwayListener from '../internal/ClickAwayListener'; -class TableBody extends React.Component { +class TableBody extends Component { static muiName = 'TableBody'; static propTypes = { @@ -11,28 +11,28 @@ class TableBody extends React.Component { * @ignore * Set to true to indicate that all rows should be selected. */ - allRowsSelected: React.PropTypes.bool, + allRowsSelected: PropTypes.bool, /** * Children passed to table body. */ - children: React.PropTypes.node, + children: PropTypes.node, /** * The css class name of the root element. */ - className: React.PropTypes.string, + className: PropTypes.string, /** * Controls whether or not to deselect all selected * rows after clicking outside the table. */ - deselectOnClickaway: React.PropTypes.bool, + deselectOnClickaway: PropTypes.bool, /** * Controls the display of the row checkbox. The default value is true. */ - displayRowCheckbox: React.PropTypes.bool, + displayRowCheckbox: PropTypes.bool, /** * @ignore @@ -40,13 +40,13 @@ class TableBody extends React.Component { * CTRL/CMD+Click and SHIFT+Click are valid actions. * The default value is false. */ - multiSelectable: React.PropTypes.bool, + multiSelectable: PropTypes.bool, /** * @ignore * Callback function for when a cell is clicked. */ - onCellClick: React.PropTypes.func, + onCellClick: PropTypes.func, /** * @ignore @@ -54,7 +54,7 @@ class TableBody extends React.Component { * is the row number of the hovered row and columnId * is the column number or the column key of the cell. */ - onCellHover: React.PropTypes.func, + onCellHover: PropTypes.func, /** * @ignore @@ -62,14 +62,14 @@ class TableBody extends React.Component { * rowNumber is the row number of the row and columnId * is the column number or the column key of the cell. */ - onCellHoverExit: React.PropTypes.func, + onCellHoverExit: PropTypes.func, /** * @ignore * Called when a table row is hovered. * rowNumber is the row number of the hovered row. */ - onRowHover: React.PropTypes.func, + onRowHover: PropTypes.func, /** * @ignore @@ -77,7 +77,7 @@ class TableBody extends React.Component { * hovered. rowNumber is the row number of the row * that is no longer hovered. */ - onRowHoverExit: React.PropTypes.func, + onRowHoverExit: PropTypes.func, /** * @ignore @@ -86,14 +86,14 @@ class TableBody extends React.Component { * the string "all" will be returned instead to indicate that * all rows have been selected. */ - onRowSelection: React.PropTypes.func, + onRowSelection: PropTypes.func, /** * Controls whether or not the rows are pre-scanned to determine * initial state. If your table has a large number of rows and * you are experiencing a delay in rendering, turn off this property. */ - preScanRows: React.PropTypes.bool, + preScanRows: PropTypes.bool, /** * @ignore @@ -101,25 +101,25 @@ class TableBody extends React.Component { * row selection is desired, enable multiSelectable. * The default value is true. */ - selectable: React.PropTypes.bool, + selectable: PropTypes.bool, /** * If true, table rows will be highlighted when * the cursor is hovering over the row. The default * value is false. */ - showRowHover: React.PropTypes.bool, + showRowHover: PropTypes.bool, /** * If true, every other table row starting * with the first row will be striped. The default value is false. */ - stripedRows: React.PropTypes.bool, + stripedRows: PropTypes.bool, /** * Override the inline-styles of the root element. */ - style: React.PropTypes.object, + style: PropTypes.object, }; static defaultProps = { @@ -133,7 +133,7 @@ class TableBody extends React.Component { }; static contextTypes = { - muiTheme: React.PropTypes.object.isRequired, + muiTheme: PropTypes.object.isRequired, }; state = { diff --git a/src/Table/TableFooter.js b/src/Table/TableFooter.js index 991d3222d9cf8d..ad450c0415745c 100644 --- a/src/Table/TableFooter.js +++ b/src/Table/TableFooter.js @@ -1,4 +1,4 @@ -import React from 'react'; +import React, {Component, PropTypes} from 'react'; import TableRowColumn from './TableRowColumn'; function getStyles(props, context) { @@ -15,7 +15,7 @@ function getStyles(props, context) { }; } -class TableFooter extends React.Component { +class TableFooter extends Component { static muiName = 'TableFooter'; static propTypes = { @@ -28,21 +28,21 @@ class TableFooter extends React.Component { * the checkbox column does not create an offset that needs * to be accounted for manually. */ - adjustForCheckbox: React.PropTypes.bool, + adjustForCheckbox: PropTypes.bool, /** * Children passed to table footer. */ - children: React.PropTypes.node, + children: PropTypes.node, /** * The css class name of the root element. */ - className: React.PropTypes.string, + className: PropTypes.string, /** * Override the inline-styles of the root element. */ - style: React.PropTypes.object, + style: PropTypes.object, }; static defaultProps = { @@ -51,7 +51,7 @@ class TableFooter extends React.Component { }; static contextTypes = { - muiTheme: React.PropTypes.object.isRequired, + muiTheme: PropTypes.object.isRequired, }; render() { diff --git a/src/Table/TableHeader.js b/src/Table/TableHeader.js index 026686ba4ba9fe..6dd03b64deeb09 100644 --- a/src/Table/TableHeader.js +++ b/src/Table/TableHeader.js @@ -1,4 +1,4 @@ -import React from 'react'; +import React, {Component, PropTypes} from 'react'; import Checkbox from '../Checkbox'; import TableHeaderColumn from './TableHeaderColumn'; @@ -12,7 +12,7 @@ function getStyles(props, context) { }; } -class TableHeader extends React.Component { +class TableHeader extends Component { static muiName = 'TableHeader'; static propTypes = { @@ -25,46 +25,46 @@ class TableHeader extends React.Component { * does not create an offset that needs to be accounted * for manually. */ - adjustForCheckbox: React.PropTypes.bool, + adjustForCheckbox: PropTypes.bool, /** * Children passed to table header. */ - children: React.PropTypes.node, + children: PropTypes.node, /** * The css class name of the root element. */ - className: React.PropTypes.string, + className: PropTypes.string, /** * Controls whether or not the select all checkbox is displayed. */ - displaySelectAll: React.PropTypes.bool, + displaySelectAll: PropTypes.bool, /** * If set to true, the select all button will be interactable. * If set to false, the button will not be interactable. * To hide the checkbox, set displaySelectAll to false. */ - enableSelectAll: React.PropTypes.bool, + enableSelectAll: PropTypes.bool, /** * @ignore * Callback when select all has been checked. */ - onSelectAll: React.PropTypes.func, + onSelectAll: PropTypes.func, /** * @ignore * True when select all has been checked. */ - selectAllSelected: React.PropTypes.bool, + selectAllSelected: PropTypes.bool, /** * Override the inline-styles of the root element. */ - style: React.PropTypes.object, + style: PropTypes.object, }; static defaultProps = { @@ -75,7 +75,7 @@ class TableHeader extends React.Component { }; static contextTypes = { - muiTheme: React.PropTypes.object.isRequired, + muiTheme: PropTypes.object.isRequired, }; createSuperHeaderRows() { diff --git a/src/Table/TableHeaderColumn.js b/src/Table/TableHeaderColumn.js index c2e7f563c5a3f3..ff0dd3daeaf371 100644 --- a/src/Table/TableHeaderColumn.js +++ b/src/Table/TableHeaderColumn.js @@ -1,4 +1,4 @@ -import React from 'react'; +import React, {Component, PropTypes} from 'react'; import Tooltip from '../internal/Tooltip'; function getStyles(props, context) { @@ -24,46 +24,46 @@ function getStyles(props, context) { }; } -class TableHeaderColumn extends React.Component { +class TableHeaderColumn extends Component { static propTypes = { - children: React.PropTypes.node, + children: PropTypes.node, /** * The css class name of the root element. */ - className: React.PropTypes.string, + className: PropTypes.string, /** * Number to identify the header row. This property * is automatically populated when used with TableHeader. */ - columnNumber: React.PropTypes.number, + columnNumber: PropTypes.number, /** * @ignore * Callback function for click event. */ - onClick: React.PropTypes.func, + onClick: PropTypes.func, /** * Override the inline-styles of the root element. */ - style: React.PropTypes.object, + style: PropTypes.object, /** * The string to supply to the tooltip. If not * string is supplied no tooltip will be shown. */ - tooltip: React.PropTypes.string, + tooltip: PropTypes.string, /** * Additional styling that can be applied to the tooltip. */ - tooltipStyle: React.PropTypes.object, + tooltipStyle: PropTypes.object, }; static contextTypes = { - muiTheme: React.PropTypes.object.isRequired, + muiTheme: PropTypes.object.isRequired, }; state = { diff --git a/src/Table/TableRow.js b/src/Table/TableRow.js index eb4c4b7cae86fe..cd3d7708ce4d27 100644 --- a/src/Table/TableRow.js +++ b/src/Table/TableRow.js @@ -1,4 +1,4 @@ -import React from 'react'; +import React, {Component, PropTypes} from 'react'; function getStyles(props, context, state) { const {tableRow} = context.muiTheme; @@ -24,28 +24,28 @@ function getStyles(props, context, state) { }; } -class TableRow extends React.Component { +class TableRow extends Component { static propTypes = { /** * Children passed to table row. */ - children: React.PropTypes.node, + children: PropTypes.node, /** * The css class name of the root element. */ - className: React.PropTypes.string, + className: PropTypes.string, /** * If true, row border will be displayed for the row. * If false, no border will be drawn. */ - displayBorder: React.PropTypes.bool, + displayBorder: PropTypes.bool, /** * Controls whether or not the row reponseds to hover events. */ - hoverable: React.PropTypes.bool, + hoverable: PropTypes.bool, /** * Controls whether or not the row should be rendered as being @@ -53,7 +53,7 @@ class TableRow extends React.Component { * and can be used to synchronize the hovered state with some other * external events. */ - hovered: React.PropTypes.bool, + hovered: PropTypes.bool, /** * @ignore @@ -61,7 +61,7 @@ class TableRow extends React.Component { * rowNumber is the row number and columnId is * the column number or the column key. */ - onCellClick: React.PropTypes.func, + onCellClick: PropTypes.func, /** * @ignore @@ -69,7 +69,7 @@ class TableRow extends React.Component { * rowNumber is the row number of the hovered row * and columnId is the column number or the column key of the cell. */ - onCellHover: React.PropTypes.func, + onCellHover: PropTypes.func, /** * @ignore @@ -77,56 +77,56 @@ class TableRow extends React.Component { * rowNumber is the row number of the row and columnId * is the column number or the column key of the cell. */ - onCellHoverExit: React.PropTypes.func, + onCellHoverExit: PropTypes.func, /** * @ignore * Called when row is clicked. */ - onRowClick: React.PropTypes.func, + onRowClick: PropTypes.func, /** * @ignore * Called when a table row is hovered. * rowNumber is the row number of the hovered row. */ - onRowHover: React.PropTypes.func, + onRowHover: PropTypes.func, /** * @ignore * Called when a table row is no longer hovered. * rowNumber is the row number of the row that is no longer hovered. */ - onRowHoverExit: React.PropTypes.func, + onRowHoverExit: PropTypes.func, /** * Number to identify the row. This property is * automatically populated when used with the TableBody component. */ - rowNumber: React.PropTypes.number, + rowNumber: PropTypes.number, /** * If true, table rows can be selected. If multiple row * selection is desired, enable multiSelectable. * The default value is true. */ - selectable: React.PropTypes.bool, + selectable: PropTypes.bool, /** * Indicates that a particular row is selected. * This property can be used to programmatically select rows. */ - selected: React.PropTypes.bool, + selected: PropTypes.bool, /** * Indicates whether or not the row is striped. */ - striped: React.PropTypes.bool, + striped: PropTypes.bool, /** * Override the inline-styles of the root element. */ - style: React.PropTypes.object, + style: PropTypes.object, }; static defaultProps = { @@ -139,7 +139,7 @@ class TableRow extends React.Component { }; static contextTypes = { - muiTheme: React.PropTypes.object.isRequired, + muiTheme: PropTypes.object.isRequired, }; state = { diff --git a/src/Table/TableRowColumn.js b/src/Table/TableRowColumn.js index 20fb2f42f8293f..73e750af4fdd9f 100644 --- a/src/Table/TableRowColumn.js +++ b/src/Table/TableRowColumn.js @@ -1,4 +1,4 @@ -import React from 'react'; +import React, {Component, PropTypes} from 'react'; function getStyles(props, context) { const {tableRowColumn} = context.muiTheme; @@ -23,50 +23,50 @@ function getStyles(props, context) { return styles; } -class TableRowColumn extends React.Component { +class TableRowColumn extends Component { static propTypes = { - children: React.PropTypes.node, + children: PropTypes.node, /** * The css class name of the root element. */ - className: React.PropTypes.string, + className: PropTypes.string, /** * @ignore * Number to identify the header row. This property * is automatically populated when used with TableHeader. */ - columnNumber: React.PropTypes.number, + columnNumber: PropTypes.number, /** * @ignore * If true, this column responds to hover events. */ - hoverable: React.PropTypes.bool, + hoverable: PropTypes.bool, /** * @ignore * Callback function for click event. */ - onClick: React.PropTypes.func, + onClick: PropTypes.func, /** * @ignore * Callback function for hover event. */ - onHover: React.PropTypes.func, + onHover: PropTypes.func, /** * @ignore * Callback function for hover exit event. */ - onHoverExit: React.PropTypes.func, + onHoverExit: PropTypes.func, /** * Override the inline-styles of the root element. */ - style: React.PropTypes.object, + style: PropTypes.object, }; static defaultProps = { @@ -74,7 +74,7 @@ class TableRowColumn extends React.Component { }; static contextTypes = { - muiTheme: React.PropTypes.object.isRequired, + muiTheme: PropTypes.object.isRequired, }; state = { diff --git a/src/Tabs/InkBar.js b/src/Tabs/InkBar.js index d73e0c43276af3..af3ab5efe9e428 100644 --- a/src/Tabs/InkBar.js +++ b/src/Tabs/InkBar.js @@ -1,4 +1,4 @@ -import React from 'react'; +import React, {Component, PropTypes} from 'react'; import transitions from '../styles/transitions'; function getStyles(props, context) { @@ -19,20 +19,20 @@ function getStyles(props, context) { }; } -class InkBar extends React.Component { +class InkBar extends Component { static propTypes = { - color: React.PropTypes.string, - left: React.PropTypes.string.isRequired, + color: PropTypes.string, + left: PropTypes.string.isRequired, /** * Override the inline-styles of the root element. */ - style: React.PropTypes.object, - width: React.PropTypes.string.isRequired, + style: PropTypes.object, + width: PropTypes.string.isRequired, }; static contextTypes = { - muiTheme: React.PropTypes.object.isRequired, + muiTheme: PropTypes.object.isRequired, }; render() { diff --git a/src/Tabs/Tab.js b/src/Tabs/Tab.js index afc6ccdea72345..67cb559f5da049 100644 --- a/src/Tabs/Tab.js +++ b/src/Tabs/Tab.js @@ -1,4 +1,4 @@ -import React from 'react'; +import React, {Component, PropTypes} from 'react'; import EnhancedButton from '../internal/EnhancedButton'; function getStyles(props, context) { @@ -23,24 +23,24 @@ function getStyles(props, context) { }; } -class Tab extends React.Component { +class Tab extends Component { static muiName = 'Tab'; static propTypes = { /** * The css class name of the root element. */ - className: React.PropTypes.string, + className: PropTypes.string, /** * Sets the icon of the tab, you can pass `FontIcon` or `SvgIcon` elements. */ - icon: React.PropTypes.node, + icon: PropTypes.node, /** * Sets the text value of the tab item to the string specified. */ - label: React.PropTypes.node, + label: PropTypes.node, /** * Fired when the active tab changes by touch or tap. @@ -48,41 +48,41 @@ class Tab extends React.Component { * For example - we are using this to route to home when the third tab becomes active. * This function will always recieve the active tab as it\'s first argument. */ - onActive: React.PropTypes.func, + onActive: PropTypes.func, /** * @ignore * This property is overriden by the Tabs component. */ - onTouchTap: React.PropTypes.func, + onTouchTap: PropTypes.func, /** * @ignore * Defines if the current tab is selected or not. * The Tabs component is responsible for setting this property. */ - selected: React.PropTypes.bool, + selected: PropTypes.bool, /** * Override the inline-styles of the root element. */ - style: React.PropTypes.object, + style: PropTypes.object, /** * If value prop passed to Tabs component, this value prop is also required. * It assigns a value to the tab so that it can be selected by the Tabs. */ - value: React.PropTypes.any, + value: PropTypes.any, /** * @ignore * This property is overriden by the Tabs component. */ - width: React.PropTypes.string, + width: PropTypes.string, }; static contextTypes = { - muiTheme: React.PropTypes.object.isRequired, + muiTheme: PropTypes.object.isRequired, }; handleTouchTap = (event) => { diff --git a/src/Tabs/TabTemplate.js b/src/Tabs/TabTemplate.js index 76bdc8fdc9d77d..ca0c7cc5b60350 100644 --- a/src/Tabs/TabTemplate.js +++ b/src/Tabs/TabTemplate.js @@ -1,9 +1,9 @@ -import React from 'react'; +import React, {Component, PropTypes} from 'react'; -class TabTemplate extends React.Component { +class TabTemplate extends Component { static propTypes = { - children: React.PropTypes.node, - selected: React.PropTypes.bool, + children: PropTypes.node, + selected: PropTypes.bool, }; render() { diff --git a/src/Tabs/Tabs.js b/src/Tabs/Tabs.js index caed9adb407cb6..56a647147b220e 100644 --- a/src/Tabs/Tabs.js +++ b/src/Tabs/Tabs.js @@ -1,4 +1,4 @@ -import React from 'react'; +import React, {Component, PropTypes} from 'react'; import ReactDOM from 'react-dom'; import TabTemplate from './TabTemplate'; import InkBar from './InkBar'; @@ -16,27 +16,27 @@ function getStyles(props, context) { }; } -class Tabs extends React.Component { +class Tabs extends Component { static propTypes = { /** * Should be used to pass `Tab` components. */ - children: React.PropTypes.node, + children: PropTypes.node, /** * The css class name of the root element. */ - className: React.PropTypes.string, + className: PropTypes.string, /** * The css class name of the content's container. */ - contentContainerClassName: React.PropTypes.string, + contentContainerClassName: PropTypes.string, /** * Override the inline-styles of the content's container. */ - contentContainerStyle: React.PropTypes.object, + contentContainerStyle: PropTypes.object, /** * Specify initial visible tab index. @@ -44,37 +44,37 @@ class Tabs extends React.Component { * If initialSelectedIndex is set but larger than the total amount of specified tabs, * initialSelectedIndex will revert back to default. */ - initialSelectedIndex: React.PropTypes.number, + initialSelectedIndex: PropTypes.number, /** * Override the inline-styles of the InkBar. */ - inkBarStyle: React.PropTypes.object, + inkBarStyle: PropTypes.object, /** * Called when the selected value change. */ - onChange: React.PropTypes.func, + onChange: PropTypes.func, /** * Override the inline-styles of the root element. */ - style: React.PropTypes.object, + style: PropTypes.object, /** * Override the inline-styles of the tab-labels container. */ - tabItemContainerStyle: React.PropTypes.object, + tabItemContainerStyle: PropTypes.object, /** * Override the default tab template used to wrap the content of each tab element. */ - tabTemplate: React.PropTypes.func, + tabTemplate: PropTypes.func, /** * Makes Tabs controllable and selects the tab whose value prop matches this prop. */ - value: React.PropTypes.any, + value: PropTypes.any, }; static defaultProps = { @@ -83,7 +83,7 @@ class Tabs extends React.Component { }; static contextTypes = { - muiTheme: React.PropTypes.object.isRequired, + muiTheme: PropTypes.object.isRequired, }; state = {selectedIndex: 0}; diff --git a/src/TextField/EnhancedTextarea.js b/src/TextField/EnhancedTextarea.js index c4db6925793510..d6b91797af9225 100644 --- a/src/TextField/EnhancedTextarea.js +++ b/src/TextField/EnhancedTextarea.js @@ -1,4 +1,4 @@ -import React from 'react'; +import React, {Component, PropTypes} from 'react'; import EventListener from 'react-event-listener'; const rowsHeight = 24; @@ -29,22 +29,22 @@ function getStyles(props, context, state) { }; } -class EnhancedTextarea extends React.Component { +class EnhancedTextarea extends Component { static propTypes = { - defaultValue: React.PropTypes.any, - disabled: React.PropTypes.bool, - onChange: React.PropTypes.func, - onHeightChange: React.PropTypes.func, - rows: React.PropTypes.number, - rowsMax: React.PropTypes.number, - shadowStyle: React.PropTypes.object, + defaultValue: PropTypes.any, + disabled: PropTypes.bool, + onChange: PropTypes.func, + onHeightChange: PropTypes.func, + rows: PropTypes.number, + rowsMax: PropTypes.number, + shadowStyle: PropTypes.object, /** * Override the inline-styles of the root element. */ - style: React.PropTypes.object, - textareaStyle: React.PropTypes.object, - value: React.PropTypes.string, - valueLink: React.PropTypes.object, + style: PropTypes.object, + textareaStyle: PropTypes.object, + value: PropTypes.string, + valueLink: PropTypes.object, }; static defaultProps = { @@ -52,7 +52,7 @@ class EnhancedTextarea extends React.Component { }; static contextTypes = { - muiTheme: React.PropTypes.object.isRequired, + muiTheme: PropTypes.object.isRequired, }; state = { diff --git a/src/TextField/TextField.js b/src/TextField/TextField.js index 94178134973932..282046764420b9 100644 --- a/src/TextField/TextField.js +++ b/src/TextField/TextField.js @@ -1,4 +1,4 @@ -import React from 'react'; +import React, {Component, PropTypes} from 'react'; import ReactDOM from 'react-dom'; import keycode from 'keycode'; import shallowEqual from 'recompose/shallowEqual'; @@ -112,169 +112,169 @@ function isValid(value) { return Boolean(value || value === 0); } -class TextField extends React.Component { +class TextField extends Component { static propTypes = { - children: React.PropTypes.node, + children: PropTypes.node, /** * The css class name of the root element. */ - className: React.PropTypes.string, + className: PropTypes.string, /** * The text string to use for the default value. */ - defaultValue: React.PropTypes.any, + defaultValue: PropTypes.any, /** * Disables the text field if set to true. */ - disabled: React.PropTypes.bool, + disabled: PropTypes.bool, /** * The style object to use to override error styles. */ - errorStyle: React.PropTypes.object, + errorStyle: PropTypes.object, /** * The error content to display. */ - errorText: React.PropTypes.node, + errorText: PropTypes.node, /** * If true, the floating label will float even when there is no value. */ - floatingLabelFixed: React.PropTypes.bool, + floatingLabelFixed: PropTypes.bool, /** * The style object to use to override floating label styles. */ - floatingLabelStyle: React.PropTypes.object, + floatingLabelStyle: PropTypes.object, /** * The content to use for the floating label element. */ - floatingLabelText: React.PropTypes.node, + floatingLabelText: PropTypes.node, /** * If true, the field receives the property width 100%. */ - fullWidth: React.PropTypes.bool, + fullWidth: PropTypes.bool, /** * Override the inline-styles of the TextField's hint text element. */ - hintStyle: React.PropTypes.object, + hintStyle: PropTypes.object, /** * The hint content to display. */ - hintText: React.PropTypes.node, + hintText: PropTypes.node, /** * The id prop for the text field. */ - id: React.PropTypes.string, + id: PropTypes.string, /** * Override the inline-styles of the TextField's input element. * When multiLine is false: define the style of the input element. * When multiLine is true: define the style of the container of the textarea. */ - inputStyle: React.PropTypes.object, + inputStyle: PropTypes.object, /** * If true, a textarea element will be rendered. * The textarea also grows and shrinks according to the number of lines. */ - multiLine: React.PropTypes.bool, + multiLine: PropTypes.bool, /** * Name applied to the input. */ - name: React.PropTypes.string, + name: PropTypes.string, /** * Callback function that is fired when the textfield loses focus. */ - onBlur: React.PropTypes.func, + onBlur: PropTypes.func, /** * Callback function that is fired when the textfield's value changes. */ - onChange: React.PropTypes.func, + onChange: PropTypes.func, /** * The function to call when the user presses the Enter key. */ - onEnterKeyDown: deprecated(React.PropTypes.func, + onEnterKeyDown: deprecated(PropTypes.func, 'Use onKeyDown and check for keycode instead.'), /** * Callback function that is fired when the textfield gains focus. */ - onFocus: React.PropTypes.func, + onFocus: PropTypes.func, /** * Callback function fired when key is pressed down. */ - onKeyDown: React.PropTypes.func, + onKeyDown: PropTypes.func, /** * Number of rows to display when multiLine option is set to true. */ - rows: React.PropTypes.number, + rows: PropTypes.number, /** * Maximum number of rows to display when * multiLine option is set to true. */ - rowsMax: React.PropTypes.number, + rowsMax: PropTypes.number, /** * Override the inline-styles of the root element. */ - style: React.PropTypes.object, + style: PropTypes.object, /** * Override the inline-styles of the TextField's textarea element. * The TextField use either a textarea or an input, * this property has effects only when multiLine is true. */ - textareaStyle: React.PropTypes.object, + textareaStyle: PropTypes.object, /** * Specifies the type of input to display * such as "password" or "text". */ - type: React.PropTypes.string, + type: PropTypes.string, /** * Override the inline-styles of the * TextField's underline element when disabled. */ - underlineDisabledStyle: React.PropTypes.object, + underlineDisabledStyle: PropTypes.object, /** * Override the inline-styles of the TextField's * underline element when focussed. */ - underlineFocusStyle: React.PropTypes.object, + underlineFocusStyle: PropTypes.object, /** * If true, shows the underline for the text field. */ - underlineShow: React.PropTypes.bool, + underlineShow: PropTypes.bool, /** * Override the inline-styles of the TextField's underline element. */ - underlineStyle: React.PropTypes.object, + underlineStyle: PropTypes.object, /** * The value of the text field. */ - value: React.PropTypes.any, + value: PropTypes.any, }; static defaultProps = { @@ -288,7 +288,7 @@ class TextField extends React.Component { }; static contextTypes = { - muiTheme: React.PropTypes.object.isRequired, + muiTheme: PropTypes.object.isRequired, }; state = { diff --git a/src/TextField/TextFieldHint.js b/src/TextField/TextFieldHint.js index 5ad7b1222b1872..16a4875cc0dc8d 100644 --- a/src/TextField/TextFieldHint.js +++ b/src/TextField/TextFieldHint.js @@ -1,4 +1,4 @@ -import React from 'react'; +import React, {PropTypes} from 'react'; import transitions from '../styles/transitions'; const propTypes = { @@ -6,22 +6,22 @@ const propTypes = { * @ignore * The material-ui theme applied to this component. */ - muiTheme: React.PropTypes.object.isRequired, + muiTheme: PropTypes.object.isRequired, /** * True if the hint text should be visible. */ - show: React.PropTypes.bool, + show: PropTypes.bool, /** * Override the inline-styles of the root element. */ - style: React.PropTypes.object, + style: PropTypes.object, /** * The hint text displayed. */ - text: React.PropTypes.node, + text: PropTypes.node, }; const defaultProps = { diff --git a/src/TextField/TextFieldLabel.js b/src/TextField/TextFieldLabel.js index c9cdb0a309245a..1858d2bb580f39 100644 --- a/src/TextField/TextFieldLabel.js +++ b/src/TextField/TextFieldLabel.js @@ -1,4 +1,4 @@ -import React from 'react'; +import React, {PropTypes} from 'react'; import transitions from '../styles/transitions'; const propTypes = { @@ -6,42 +6,42 @@ const propTypes = { * @ignore * The material-ui theme applied to this component. */ - muiTheme: React.PropTypes.object.isRequired, + muiTheme: PropTypes.object.isRequired, /** * The css class name of the root element. */ - className: React.PropTypes.string, + className: PropTypes.string, /** * The label contents. */ - children: React.PropTypes.node, + children: PropTypes.node, /** * Disables the label if set to true. */ - disabled: React.PropTypes.bool, + disabled: PropTypes.bool, /** * True if the floating label should shrink. */ - shrink: React.PropTypes.bool, + shrink: PropTypes.bool, /** * The id of the target element that this label should refer to. */ - htmlFor: React.PropTypes.string, + htmlFor: PropTypes.string, /** * Callback function for when the label is selected via a touch tap. */ - onTouchTap: React.PropTypes.func, + onTouchTap: PropTypes.func, /** * Override the inline-styles of the root element. */ - style: React.PropTypes.object, + style: PropTypes.object, }; const defaultProps = { diff --git a/src/TextField/TextFieldUnderline.js b/src/TextField/TextFieldUnderline.js index 2008830717fb25..931bfbb4d2daf5 100644 --- a/src/TextField/TextFieldUnderline.js +++ b/src/TextField/TextFieldUnderline.js @@ -1,47 +1,47 @@ -import React from 'react'; +import React, {PropTypes} from 'react'; import transitions from '../styles/transitions'; const propTypes = { /** * True if the parent `TextField` is disabled. */ - disabled: React.PropTypes.bool, + disabled: PropTypes.bool, /** * Override the inline-styles of the underline when parent `TextField` is disabled. */ - disabledStyle: React.PropTypes.object, + disabledStyle: PropTypes.object, /** * True if the parent `TextField` has an error. */ - error: React.PropTypes.bool, + error: PropTypes.bool, /** * Override the inline-styles of the underline when parent `TextField` has an error. */ - errorStyle: React.PropTypes.object, + errorStyle: PropTypes.object, /** * True if the parent `TextField` is focused. */ - focus: React.PropTypes.bool, + focus: PropTypes.bool, /** * Override the inline-styles of the underline when parent `TextField` is focused. */ - focusStyle: React.PropTypes.object, + focusStyle: PropTypes.object, /** * @ignore * The material-ui theme applied to this component. */ - muiTheme: React.PropTypes.object.isRequired, + muiTheme: PropTypes.object.isRequired, /** * Override the inline-styles of the root element. */ - style: React.PropTypes.object, + style: PropTypes.object, }; const defaultProps = { diff --git a/src/TimePicker/Clock.js b/src/TimePicker/Clock.js index c0c13800ad36a8..e63847231ea3f1 100644 --- a/src/TimePicker/Clock.js +++ b/src/TimePicker/Clock.js @@ -1,16 +1,16 @@ -import React from 'react'; +import React, {Component, PropTypes} from 'react'; import TimeDisplay from './TimeDisplay'; import ClockHours from './ClockHours'; import ClockMinutes from './ClockMinutes'; -class Clock extends React.Component { +class Clock extends Component { static propTypes = { - format: React.PropTypes.oneOf(['ampm', '24hr']), - initialTime: React.PropTypes.object, - isActive: React.PropTypes.bool, - mode: React.PropTypes.oneOf(['hour', 'minute']), - onChangeHours: React.PropTypes.func, - onChangeMinutes: React.PropTypes.func, + format: PropTypes.oneOf(['ampm', '24hr']), + initialTime: PropTypes.object, + isActive: PropTypes.bool, + mode: PropTypes.oneOf(['hour', 'minute']), + onChangeHours: PropTypes.func, + onChangeMinutes: PropTypes.func, }; static defaultProps = { @@ -18,7 +18,7 @@ class Clock extends React.Component { }; static contextTypes = { - muiTheme: React.PropTypes.object.isRequired, + muiTheme: PropTypes.object.isRequired, }; state = { diff --git a/src/TimePicker/ClockHours.js b/src/TimePicker/ClockHours.js index 5ef95cd4cb209f..a514ca0f78f623 100644 --- a/src/TimePicker/ClockHours.js +++ b/src/TimePicker/ClockHours.js @@ -1,14 +1,14 @@ -import React from 'react'; +import React, {Component, PropTypes} from 'react'; import ReactDOM from 'react-dom'; import ClockNumber from './ClockNumber'; import ClockPointer from './ClockPointer'; import {getTouchEventOffsetValues, rad2deg} from './timeUtils'; -class ClockHours extends React.Component { +class ClockHours extends Component { static propTypes = { - format: React.PropTypes.oneOf(['ampm', '24hr']), - initialHours: React.PropTypes.number, - onChange: React.PropTypes.func, + format: PropTypes.oneOf(['ampm', '24hr']), + initialHours: PropTypes.number, + onChange: PropTypes.func, }; static defaultProps = { @@ -18,7 +18,7 @@ class ClockHours extends React.Component { }; static contextTypes = { - muiTheme: React.PropTypes.object.isRequired, + muiTheme: PropTypes.object.isRequired, }; componentDidMount() { diff --git a/src/TimePicker/ClockMinutes.js b/src/TimePicker/ClockMinutes.js index 292dd79e5604f8..fcabdeb1cdf7ba 100644 --- a/src/TimePicker/ClockMinutes.js +++ b/src/TimePicker/ClockMinutes.js @@ -1,12 +1,12 @@ -import React from 'react'; +import React, {Component, PropTypes} from 'react'; import ClockNumber from './ClockNumber'; import ClockPointer from './ClockPointer'; import {getTouchEventOffsetValues, rad2deg} from './timeUtils'; -class ClockMinutes extends React.Component { +class ClockMinutes extends Component { static propTypes = { - initialMinutes: React.PropTypes.number, - onChange: React.PropTypes.func, + initialMinutes: PropTypes.number, + onChange: PropTypes.func, }; static defaultProps = { @@ -15,7 +15,7 @@ class ClockMinutes extends React.Component { }; static contextTypes = { - muiTheme: React.PropTypes.object.isRequired, + muiTheme: PropTypes.object.isRequired, }; componentDidMount() { diff --git a/src/TimePicker/ClockNumber.js b/src/TimePicker/ClockNumber.js index e3723f24f0daf3..f482fa894fece4 100644 --- a/src/TimePicker/ClockNumber.js +++ b/src/TimePicker/ClockNumber.js @@ -1,4 +1,4 @@ -import React from 'react'; +import React, {Component, PropTypes} from 'react'; import {isInner} from './timeUtils'; function getStyles(props, context) { @@ -81,12 +81,12 @@ function getStyles(props, context) { return styles; } -class ClockNumber extends React.Component { +class ClockNumber extends Component { static propTypes = { - isSelected: React.PropTypes.bool, - onSelected: React.PropTypes.func, - type: React.PropTypes.oneOf(['hour', 'minute']), - value: React.PropTypes.number, + isSelected: PropTypes.bool, + onSelected: PropTypes.func, + type: PropTypes.oneOf(['hour', 'minute']), + value: PropTypes.number, }; static defaultProps = { @@ -96,7 +96,7 @@ class ClockNumber extends React.Component { }; static contextTypes = { - muiTheme: React.PropTypes.object.isRequired, + muiTheme: PropTypes.object.isRequired, }; render() { diff --git a/src/TimePicker/ClockPointer.js b/src/TimePicker/ClockPointer.js index c790d9c4832ca0..104c768ba9c7a6 100644 --- a/src/TimePicker/ClockPointer.js +++ b/src/TimePicker/ClockPointer.js @@ -1,4 +1,4 @@ -import React from 'react'; +import React, {Component, PropTypes} from 'react'; import {isInner} from './timeUtils'; function calcAngle(value, base) { @@ -41,11 +41,11 @@ function getStyles(props, context, state) { return styles; } -class ClockPointer extends React.Component { +class ClockPointer extends Component { static propTypes = { - hasSelected: React.PropTypes.bool, - type: React.PropTypes.oneOf(['hour', 'minute']), - value: React.PropTypes.number, + hasSelected: PropTypes.bool, + type: PropTypes.oneOf(['hour', 'minute']), + value: PropTypes.number, }; static defaultProps = { @@ -55,7 +55,7 @@ class ClockPointer extends React.Component { }; static contextTypes = { - muiTheme: React.PropTypes.object.isRequired, + muiTheme: PropTypes.object.isRequired, }; state = { diff --git a/src/TimePicker/TimeDisplay.js b/src/TimePicker/TimeDisplay.js index 7f97e8c10842b6..d289b5db27f04d 100644 --- a/src/TimePicker/TimeDisplay.js +++ b/src/TimePicker/TimeDisplay.js @@ -1,14 +1,14 @@ -import React from 'react'; +import React, {Component, PropTypes} from 'react'; -class TimeDisplay extends React.Component { +class TimeDisplay extends Component { static propTypes = { - affix: React.PropTypes.oneOf(['', 'pm', 'am']), - format: React.PropTypes.oneOf(['ampm', '24hr']), - mode: React.PropTypes.oneOf(['hour', 'minute']), - onSelectAffix: React.PropTypes.func, - onSelectHour: React.PropTypes.func, - onSelectMin: React.PropTypes.func, - selectedTime: React.PropTypes.object.isRequired, + affix: PropTypes.oneOf(['', 'pm', 'am']), + format: PropTypes.oneOf(['ampm', '24hr']), + mode: PropTypes.oneOf(['hour', 'minute']), + onSelectAffix: PropTypes.func, + onSelectHour: PropTypes.func, + onSelectMin: PropTypes.func, + selectedTime: PropTypes.object.isRequired, }; static defaultProps = { @@ -17,7 +17,7 @@ class TimeDisplay extends React.Component { }; static contextTypes = { - muiTheme: React.PropTypes.object.isRequired, + muiTheme: PropTypes.object.isRequired, }; state = { diff --git a/src/TimePicker/TimePicker.js b/src/TimePicker/TimePicker.js index 75d9271c6bf85c..9cd7e84e4a0361 100644 --- a/src/TimePicker/TimePicker.js +++ b/src/TimePicker/TimePicker.js @@ -1,4 +1,4 @@ -import React from 'react'; +import React, {Component, PropTypes} from 'react'; import warning from 'warning'; import TimePickerDialog from './TimePickerDialog'; import TextField from '../TextField'; @@ -10,64 +10,64 @@ emptyTime.setMinutes(0); emptyTime.setSeconds(0); emptyTime.setMilliseconds(0); -class TimePicker extends React.Component { +class TimePicker extends Component { static propTypes = { /** * If true, automatically accept and close the picker on set minutes. */ - autoOk: React.PropTypes.bool, + autoOk: PropTypes.bool, /** * Override the label of the 'Cancel' button. */ - cancelLabel: React.PropTypes.node, + cancelLabel: PropTypes.node, /** * The initial time value of the TimePicker. */ - defaultTime: React.PropTypes.object, + defaultTime: PropTypes.object, /** * If true, the TimePicker is disabled. */ - disabled: React.PropTypes.bool, + disabled: PropTypes.bool, /** * Tells the component to display the picker in `ampm` (12hr) format or `24hr` format. */ - format: React.PropTypes.oneOf(['ampm', '24hr']), + format: PropTypes.oneOf(['ampm', '24hr']), /** * Override the label of the 'OK' button. */ - okLabel: React.PropTypes.node, + okLabel: PropTypes.node, /** * Callback function that is fired when the time value changes. The time value is passed in a Date Object. * Since there is no particular event associated with the change the first argument will always be null * and the second argument will be the new Date instance. */ - onChange: React.PropTypes.func, + onChange: PropTypes.func, /** * Callback function fired when the TimePicker dialog is dismissed. */ - onDismiss: React.PropTypes.func, + onDismiss: PropTypes.func, /** * Callback function fired when the TimePicker `TextField` gains focus. */ - onFocus: React.PropTypes.func, + onFocus: PropTypes.func, /** * Callback function fired when the TimePicker dialog is shown. */ - onShow: React.PropTypes.func, + onShow: PropTypes.func, /** * Callback function fired when the TimePicker is tapped or clicked. */ - onTouchTap: React.PropTypes.func, + onTouchTap: PropTypes.func, /** * If true, uses ("noon" / "midnight") instead of ("12 a.m." / "12 p.m."). @@ -76,22 +76,22 @@ class TimePicker extends React.Component { * and it avoids confusion between different locales. By default (for compatibility reasons) TimePicker uses * ("12 a.m." / "12 p.m."). */ - pedantic: React.PropTypes.bool, + pedantic: PropTypes.bool, /** * Override the inline-styles of the root element. */ - style: React.PropTypes.object, + style: PropTypes.object, /** * Override the inline-styles of TimePicker's TextField element. */ - textFieldStyle: React.PropTypes.object, + textFieldStyle: PropTypes.object, /** * Sets the time for the Time Picker programmatically. */ - value: React.PropTypes.object, + value: PropTypes.object, }; @@ -107,7 +107,7 @@ class TimePicker extends React.Component { }; static contextTypes = { - muiTheme: React.PropTypes.object.isRequired, + muiTheme: PropTypes.object.isRequired, }; state = { diff --git a/src/TimePicker/TimePickerDialog.js b/src/TimePicker/TimePickerDialog.js index 89abcfa5bc61ef..a024a0b318fe6e 100644 --- a/src/TimePicker/TimePickerDialog.js +++ b/src/TimePicker/TimePickerDialog.js @@ -1,20 +1,20 @@ -import React from 'react'; +import React, {Component, PropTypes} from 'react'; import EventListener from 'react-event-listener'; import keycode from 'keycode'; import Clock from './Clock'; import Dialog from '../Dialog'; import FlatButton from '../FlatButton'; -class TimePickerDialog extends React.Component { +class TimePickerDialog extends Component { static propTypes = { - autoOk: React.PropTypes.bool, - cancelLabel: React.PropTypes.node, - format: React.PropTypes.oneOf(['ampm', '24hr']), - initialTime: React.PropTypes.object, - okLabel: React.PropTypes.node, - onAccept: React.PropTypes.func, - onDismiss: React.PropTypes.func, - onShow: React.PropTypes.func, + autoOk: PropTypes.bool, + cancelLabel: PropTypes.node, + format: PropTypes.oneOf(['ampm', '24hr']), + initialTime: PropTypes.object, + okLabel: PropTypes.node, + onAccept: PropTypes.func, + onDismiss: PropTypes.func, + onShow: PropTypes.func, }; static defaultProps = { @@ -23,7 +23,7 @@ class TimePickerDialog extends React.Component { }; static contextTypes = { - muiTheme: React.PropTypes.object.isRequired, + muiTheme: PropTypes.object.isRequired, }; state = { diff --git a/src/Toggle/Toggle.js b/src/Toggle/Toggle.js index 21683c87c25c8b..43be63bd63f132 100644 --- a/src/Toggle/Toggle.js +++ b/src/Toggle/Toggle.js @@ -1,4 +1,4 @@ -import React from 'react'; +import React, {Component, PropTypes} from 'react'; import transitions from '../styles/transitions'; import Paper from '../Paper'; import EnhancedSwitch from '../internal/EnhancedSwitch'; @@ -66,7 +66,7 @@ function getStyles(props, context, state) { return styles; } -class Toggle extends React.Component { +class Toggle extends Component { static propTypes = { /** * Determines whether the Toggle is initially turned on. @@ -74,77 +74,77 @@ class Toggle extends React.Component { * Decide between using a controlled or uncontrolled input element and remove one of these props. * More info: https://fb.me/react-controlled-components */ - defaultToggled: React.PropTypes.bool, + defaultToggled: PropTypes.bool, /** * Will disable the toggle if true. */ - disabled: React.PropTypes.bool, + disabled: PropTypes.bool, /** * Overrides the inline-styles of the Toggle element. */ - elementStyle: React.PropTypes.object, + elementStyle: PropTypes.object, /** * Overrides the inline-styles of the Icon element. */ - iconStyle: React.PropTypes.object, + iconStyle: PropTypes.object, /** * Overrides the inline-styles of the input element. */ - inputStyle: React.PropTypes.object, + inputStyle: PropTypes.object, /** * Label for toggle. */ - label: React.PropTypes.string, + label: PropTypes.string, /** * Where the label will be placed next to the toggle. */ - labelPosition: React.PropTypes.oneOf(['left', 'right']), + labelPosition: PropTypes.oneOf(['left', 'right']), /** * Overrides the inline-styles of the Toggle element label. */ - labelStyle: React.PropTypes.object, + labelStyle: PropTypes.object, /** * Callback function that is fired when the toggle switch is toggled. */ - onToggle: React.PropTypes.func, + onToggle: PropTypes.func, /** * Override style of ripple. */ - rippleStyle: React.PropTypes.object, + rippleStyle: PropTypes.object, /** * Override the inline-styles of the root element. */ - style: React.PropTypes.object, + style: PropTypes.object, /** * Override style for thumb. */ - thumbStyle: React.PropTypes.object, + thumbStyle: PropTypes.object, /** * Toggled if set to true. */ - toggled: React.PropTypes.bool, + toggled: PropTypes.bool, /** * Override style for track. */ - trackStyle: React.PropTypes.object, + trackStyle: PropTypes.object, /** * ValueLink prop for when using controlled toggle. */ - valueLink: React.PropTypes.object, + valueLink: PropTypes.object, }; static defaultProps = { @@ -154,7 +154,7 @@ class Toggle extends React.Component { }; static contextTypes = { - muiTheme: React.PropTypes.object.isRequired, + muiTheme: PropTypes.object.isRequired, }; state = {switched: false}; diff --git a/src/Toolbar/Toolbar.js b/src/Toolbar/Toolbar.js index 8da93c1808d0f3..58a10d6a49a467 100644 --- a/src/Toolbar/Toolbar.js +++ b/src/Toolbar/Toolbar.js @@ -1,4 +1,4 @@ -import React from 'react'; +import React, {Component, PropTypes} from 'react'; function getStyles(props, context) { const {noGutter} = props; @@ -21,27 +21,27 @@ function getStyles(props, context) { }; } -class Toolbar extends React.Component { +class Toolbar extends Component { static propTypes = { /** * Can be a `ToolbarGroup` to render a group of related items. */ - children: React.PropTypes.node, + children: PropTypes.node, /** * The css class name of the root element. */ - className: React.PropTypes.string, + className: PropTypes.string, /** * Do not apply `desktopGutter` to the `Toolbar`. */ - noGutter: React.PropTypes.bool, + noGutter: PropTypes.bool, /** * Override the inline-styles of the root element. */ - style: React.PropTypes.object, + style: PropTypes.object, }; static defaultProps = { @@ -49,7 +49,7 @@ class Toolbar extends React.Component { }; static contextTypes = { - muiTheme: React.PropTypes.object.isRequired, + muiTheme: PropTypes.object.isRequired, }; render() { diff --git a/src/Toolbar/ToolbarGroup.js b/src/Toolbar/ToolbarGroup.js index 8a2e7d08c318cd..36653fa24d7eb4 100644 --- a/src/Toolbar/ToolbarGroup.js +++ b/src/Toolbar/ToolbarGroup.js @@ -1,4 +1,4 @@ -import React from 'react'; +import React, {Component, PropTypes} from 'react'; function getStyles(props, context) { const { @@ -62,39 +62,39 @@ function getStyles(props, context) { return styles; } -class ToolbarGroup extends React.Component { +class ToolbarGroup extends Component { static propTypes = { /** * Can be any node or number of nodes. */ - children: React.PropTypes.node, + children: PropTypes.node, /** * The css class name of the root element. */ - className: React.PropTypes.string, + className: PropTypes.string, /** * Set this to true for if the `ToolbarGroup` is the first child of `Toolbar` * to prevent setting the left gap. */ - firstChild: React.PropTypes.bool, + firstChild: PropTypes.bool, /** * Determines the side the `ToolbarGroup` will snap to. Either 'left' or 'right'. */ - float: React.PropTypes.oneOf(['left', 'right']), + float: PropTypes.oneOf(['left', 'right']), /** * Set this to true for if the `ToolbarGroup` is the last child of `Toolbar` * to prevent setting the right gap. */ - lastChild: React.PropTypes.bool, + lastChild: PropTypes.bool, /** * Override the inline-styles of the root element. */ - style: React.PropTypes.object, + style: PropTypes.object, }; static defaultProps = { @@ -103,7 +103,7 @@ class ToolbarGroup extends React.Component { }; static contextTypes = { - muiTheme: React.PropTypes.object.isRequired, + muiTheme: PropTypes.object.isRequired, }; handleMouseEnterFontIcon(style) { diff --git a/src/Toolbar/ToolbarSeparator.js b/src/Toolbar/ToolbarSeparator.js index 10ea6a83c9faa0..a3a56c65a6bd22 100644 --- a/src/Toolbar/ToolbarSeparator.js +++ b/src/Toolbar/ToolbarSeparator.js @@ -1,4 +1,4 @@ -import React from 'react'; +import React, {Component, PropTypes} from 'react'; function getStyles(props, context) { const { @@ -19,23 +19,23 @@ function getStyles(props, context) { }; } -class ToolbarSeparator extends React.Component { +class ToolbarSeparator extends Component { static muiName = 'ToolbarSeparator'; static propTypes = { /** * The css class name of the root element. */ - className: React.PropTypes.string, + className: PropTypes.string, /** * Override the inline-styles of the root element. */ - style: React.PropTypes.object, + style: PropTypes.object, }; static contextTypes = { - muiTheme: React.PropTypes.object.isRequired, + muiTheme: PropTypes.object.isRequired, }; render() { diff --git a/src/Toolbar/ToolbarTitle.js b/src/Toolbar/ToolbarTitle.js index 748238aa9e41c7..a725c4be85f5ce 100644 --- a/src/Toolbar/ToolbarTitle.js +++ b/src/Toolbar/ToolbarTitle.js @@ -1,4 +1,4 @@ -import React from 'react'; +import React, {Component, PropTypes} from 'react'; function getStyles(props, context) { const { @@ -19,28 +19,28 @@ function getStyles(props, context) { }; } -class ToolbarTitle extends React.Component { +class ToolbarTitle extends Component { static muiName = 'ToolbarTitle'; static propTypes = { /** * The css class name of the root element. */ - className: React.PropTypes.string, + className: PropTypes.string, /** * Override the inline-styles of the root element. */ - style: React.PropTypes.object, + style: PropTypes.object, /** * The text to be displayed. */ - text: React.PropTypes.string, + text: PropTypes.string, }; static contextTypes = { - muiTheme: React.PropTypes.object.isRequired, + muiTheme: PropTypes.object.isRequired, }; render() { diff --git a/src/internal/AppCanvas.js b/src/internal/AppCanvas.js index ac5a385cf943e6..640e3964297c10 100644 --- a/src/internal/AppCanvas.js +++ b/src/internal/AppCanvas.js @@ -1,12 +1,12 @@ -import React from 'react'; +import React, {Component, PropTypes} from 'react'; -class AppCanvas extends React.Component { +class AppCanvas extends Component { static propTypes = { - children: React.PropTypes.node, + children: PropTypes.node, }; static contextTypes = { - muiTheme: React.PropTypes.object.isRequired, + muiTheme: PropTypes.object.isRequired, }; render() { diff --git a/src/internal/AutoLockScrolling.js b/src/internal/AutoLockScrolling.js index a5602d1e3964c3..872c3ef063586f 100644 --- a/src/internal/AutoLockScrolling.js +++ b/src/internal/AutoLockScrolling.js @@ -1,12 +1,12 @@ -import React from 'react'; +import {Component, PropTypes} from 'react'; let originalBodyOverflow = null; let lockingCounter = 0; -export default class AutoLockScrolling extends React.Component { +export default class AutoLockScrolling extends Component { static propTypes = { - lock: React.PropTypes.bool.isRequired, + lock: PropTypes.bool.isRequired, }; componentDidMount() { diff --git a/src/internal/BeforeAfterWrapper.js b/src/internal/BeforeAfterWrapper.js index 805f78bc41580b..de3eb798c050be 100644 --- a/src/internal/BeforeAfterWrapper.js +++ b/src/internal/BeforeAfterWrapper.js @@ -1,4 +1,4 @@ -import React from 'react'; +import React, {Component, PropTypes} from 'react'; /** * BeforeAfterWrapper @@ -40,19 +40,19 @@ const styles = { }, }; -class BeforeAfterWrapper extends React.Component { +class BeforeAfterWrapper extends Component { static propTypes = { - afterElementType: React.PropTypes.string, - afterStyle: React.PropTypes.object, - beforeElementType: React.PropTypes.string, - beforeStyle: React.PropTypes.object, - children: React.PropTypes.node, - elementType: React.PropTypes.string, + afterElementType: PropTypes.string, + afterStyle: PropTypes.object, + beforeElementType: PropTypes.string, + beforeStyle: PropTypes.object, + children: PropTypes.node, + elementType: PropTypes.string, /** * Override the inline-styles of the root element. */ - style: React.PropTypes.object, + style: PropTypes.object, }; static defaultProps = { @@ -62,7 +62,7 @@ class BeforeAfterWrapper extends React.Component { }; static contextTypes = { - muiTheme: React.PropTypes.object.isRequired, + muiTheme: PropTypes.object.isRequired, }; render() { diff --git a/src/internal/CircleRipple.js b/src/internal/CircleRipple.js index ef84b1d744e6dc..a6ffcd79c1d4d8 100644 --- a/src/internal/CircleRipple.js +++ b/src/internal/CircleRipple.js @@ -1,15 +1,15 @@ -import React from 'react'; +import React, {Component, PropTypes} from 'react'; import ReactDOM from 'react-dom'; import shallowEqual from 'recompose/shallowEqual'; import autoPrefix from '../utils/autoPrefix'; import transitions from '../styles/transitions'; -class CircleRipple extends React.Component { +class CircleRipple extends Component { static propTypes = { - aborted: React.PropTypes.bool, - color: React.PropTypes.string, - opacity: React.PropTypes.number, - style: React.PropTypes.object, + aborted: PropTypes.bool, + color: PropTypes.string, + opacity: PropTypes.number, + style: PropTypes.object, }; static defaultProps = { @@ -18,7 +18,7 @@ class CircleRipple extends React.Component { }; static contextTypes = { - muiTheme: React.PropTypes.object.isRequired, + muiTheme: PropTypes.object.isRequired, }; shouldComponentUpdate(nextProps) { diff --git a/src/internal/ClearFix.js b/src/internal/ClearFix.js index cb9ae50d76dc18..ce877dba625e1f 100644 --- a/src/internal/ClearFix.js +++ b/src/internal/ClearFix.js @@ -1,4 +1,4 @@ -import React from 'react'; +import React, {PropTypes} from 'react'; import BeforeAfterWrapper from './BeforeAfterWrapper'; const styles = { @@ -27,12 +27,12 @@ const ClearFix = ({style, children, ...other}) => ( ClearFix.muiName = 'ClearFix'; ClearFix.propTypes = { - children: React.PropTypes.node, + children: PropTypes.node, /** * Override the inline-styles of the root element. */ - style: React.PropTypes.object, + style: PropTypes.object, }; export default ClearFix; diff --git a/src/internal/ClickAwayListener.js b/src/internal/ClickAwayListener.js index 158ee332386cb5..a4a5086d256346 100644 --- a/src/internal/ClickAwayListener.js +++ b/src/internal/ClickAwayListener.js @@ -1,4 +1,4 @@ -import React from 'react'; +import {Component, PropTypes} from 'react'; import ReactDOM from 'react-dom'; import events from '../utils/events'; @@ -13,11 +13,11 @@ const clickAwayEvents = ['mouseup', 'touchend']; const bind = (callback) => clickAwayEvents.forEach((event) => events.on(document, event, callback)); const unbind = (callback) => clickAwayEvents.forEach((event) => events.off(document, event, callback)); -export default class ClickAwayListener extends React.Component { +export default class ClickAwayListener extends Component { static propTypes = { - children: React.PropTypes.node, - onClickAway: React.PropTypes.any, + children: PropTypes.node, + onClickAway: PropTypes.any, }; componentDidMount() { diff --git a/src/internal/EnhancedButton.js b/src/internal/EnhancedButton.js index badd7ef0d1be8b..5a387949e17c05 100644 --- a/src/internal/EnhancedButton.js +++ b/src/internal/EnhancedButton.js @@ -1,4 +1,4 @@ -import React from 'react'; +import React, {Component, PropTypes} from 'react'; import {createChildFragment} from '../utils/childUtils'; import Events from '../utils/events'; import keycode from 'keycode'; @@ -35,34 +35,34 @@ function listenForTabPresses() { } } -class EnhancedButton extends React.Component { +class EnhancedButton extends Component { static propTypes = { - centerRipple: React.PropTypes.bool, - children: React.PropTypes.node, - containerElement: React.PropTypes.oneOfType([ - React.PropTypes.string, - React.PropTypes.element, + centerRipple: PropTypes.bool, + children: PropTypes.node, + containerElement: PropTypes.oneOfType([ + PropTypes.string, + PropTypes.element, ]), - disableFocusRipple: React.PropTypes.bool, - disableKeyboardFocus: React.PropTypes.bool, - disableTouchRipple: React.PropTypes.bool, - disabled: React.PropTypes.bool, - focusRippleColor: React.PropTypes.string, - focusRippleOpacity: React.PropTypes.number, - keyboardFocused: React.PropTypes.bool, - linkButton: React.PropTypes.bool, - onBlur: React.PropTypes.func, - onClick: React.PropTypes.func, - onFocus: React.PropTypes.func, - onKeyDown: React.PropTypes.func, - onKeyUp: React.PropTypes.func, - onKeyboardFocus: React.PropTypes.func, - onTouchTap: React.PropTypes.func, - style: React.PropTypes.object, - tabIndex: React.PropTypes.number, - touchRippleColor: React.PropTypes.string, - touchRippleOpacity: React.PropTypes.number, - type: React.PropTypes.string, + disableFocusRipple: PropTypes.bool, + disableKeyboardFocus: PropTypes.bool, + disableTouchRipple: PropTypes.bool, + disabled: PropTypes.bool, + focusRippleColor: PropTypes.string, + focusRippleOpacity: PropTypes.number, + keyboardFocused: PropTypes.bool, + linkButton: PropTypes.bool, + onBlur: PropTypes.func, + onClick: PropTypes.func, + onFocus: PropTypes.func, + onKeyDown: PropTypes.func, + onKeyUp: PropTypes.func, + onKeyboardFocus: PropTypes.func, + onTouchTap: PropTypes.func, + style: PropTypes.object, + tabIndex: PropTypes.number, + touchRippleColor: PropTypes.string, + touchRippleOpacity: PropTypes.number, + type: PropTypes.string, }; static defaultProps = { @@ -79,7 +79,7 @@ class EnhancedButton extends React.Component { }; static contextTypes = { - muiTheme: React.PropTypes.object.isRequired, + muiTheme: PropTypes.object.isRequired, }; state = {isKeyboardFocused: false}; diff --git a/src/internal/EnhancedSwitch.js b/src/internal/EnhancedSwitch.js index 98d379b16a5861..217e08537d0030 100644 --- a/src/internal/EnhancedSwitch.js +++ b/src/internal/EnhancedSwitch.js @@ -1,4 +1,4 @@ -import React from 'react'; +import React, {Component, PropTypes} from 'react'; import EventListener from 'react-event-listener'; import keycode from 'keycode'; import transitions from '../styles/transitions'; @@ -68,42 +68,42 @@ function getStyles(props, context) { }; } -class EnhancedSwitch extends React.Component { +class EnhancedSwitch extends Component { static propTypes = { - checked: React.PropTypes.bool, - className: React.PropTypes.string, - defaultChecked: React.PropTypes.bool, - disableFocusRipple: React.PropTypes.bool, - disableTouchRipple: React.PropTypes.bool, - disabled: React.PropTypes.bool, - iconStyle: React.PropTypes.object, - inputStyle: React.PropTypes.object, - inputType: React.PropTypes.string.isRequired, - label: React.PropTypes.node, - labelPosition: React.PropTypes.oneOf(['left', 'right']), - labelStyle: React.PropTypes.object, - name: React.PropTypes.string, - onBlur: React.PropTypes.func, - onFocus: React.PropTypes.func, - onMouseDown: React.PropTypes.func, - onMouseLeave: React.PropTypes.func, - onMouseUp: React.PropTypes.func, - onParentShouldUpdate: React.PropTypes.func, - onSwitch: React.PropTypes.func, - onTouchEnd: React.PropTypes.func, - onTouchStart: React.PropTypes.func, - rippleColor: React.PropTypes.string, - rippleStyle: React.PropTypes.object, - style: React.PropTypes.object, - switchElement: React.PropTypes.element.isRequired, - switched: React.PropTypes.bool.isRequired, - thumbStyle: React.PropTypes.object, - trackStyle: React.PropTypes.object, - value: React.PropTypes.string, + checked: PropTypes.bool, + className: PropTypes.string, + defaultChecked: PropTypes.bool, + disableFocusRipple: PropTypes.bool, + disableTouchRipple: PropTypes.bool, + disabled: PropTypes.bool, + iconStyle: PropTypes.object, + inputStyle: PropTypes.object, + inputType: PropTypes.string.isRequired, + label: PropTypes.node, + labelPosition: PropTypes.oneOf(['left', 'right']), + labelStyle: PropTypes.object, + name: PropTypes.string, + onBlur: PropTypes.func, + onFocus: PropTypes.func, + onMouseDown: PropTypes.func, + onMouseLeave: PropTypes.func, + onMouseUp: PropTypes.func, + onParentShouldUpdate: PropTypes.func, + onSwitch: PropTypes.func, + onTouchEnd: PropTypes.func, + onTouchStart: PropTypes.func, + rippleColor: PropTypes.string, + rippleStyle: PropTypes.object, + style: PropTypes.object, + switchElement: PropTypes.element.isRequired, + switched: PropTypes.bool.isRequired, + thumbStyle: PropTypes.object, + trackStyle: PropTypes.object, + value: PropTypes.string, }; static contextTypes = { - muiTheme: React.PropTypes.object.isRequired, + muiTheme: PropTypes.object.isRequired, }; state = { diff --git a/src/internal/ExpandTransition.js b/src/internal/ExpandTransition.js index 99a3a4185a062b..a306104242968a 100644 --- a/src/internal/ExpandTransition.js +++ b/src/internal/ExpandTransition.js @@ -1,8 +1,8 @@ -import React, {PropTypes} from 'react'; +import React, {Component, PropTypes} from 'react'; import ReactTransitionGroup from 'react-addons-transition-group'; import ExpandTransitionChild from './ExpandTransitionChild'; -class ExpandTransition extends React.Component { +class ExpandTransition extends Component { static propTypes = { children: PropTypes.node, enterDelay: PropTypes.number, @@ -18,7 +18,7 @@ class ExpandTransition extends React.Component { }; static contextTypes = { - muiTheme: React.PropTypes.object.isRequired, + muiTheme: PropTypes.object.isRequired, }; renderChildren(children, loading) { diff --git a/src/internal/ExpandTransitionChild.js b/src/internal/ExpandTransitionChild.js index 4ca669cf285746..0f75a09b76d882 100644 --- a/src/internal/ExpandTransitionChild.js +++ b/src/internal/ExpandTransitionChild.js @@ -1,12 +1,12 @@ -import React from 'react'; +import React, {Component, PropTypes} from 'react'; import ReactDOM from 'react-dom'; import transitions from '../styles/transitions'; -class ExpandTransitionChild extends React.Component { +class ExpandTransitionChild extends Component { static propTypes = { - children: React.PropTypes.node, - enterDelay: React.PropTypes.number, - style: React.PropTypes.object, + children: PropTypes.node, + enterDelay: PropTypes.number, + style: PropTypes.object, }; static defaultProps = { @@ -14,7 +14,7 @@ class ExpandTransitionChild extends React.Component { }; static contextTypes = { - muiTheme: React.PropTypes.object.isRequired, + muiTheme: PropTypes.object.isRequired, }; componentDidUpdate() { diff --git a/src/internal/FocusRipple.js b/src/internal/FocusRipple.js index d5004dc7861310..1cb7b38463dde6 100644 --- a/src/internal/FocusRipple.js +++ b/src/internal/FocusRipple.js @@ -1,4 +1,4 @@ -import React from 'react'; +import React, {Component, PropTypes} from 'react'; import ReactDOM from 'react-dom'; import shallowEqual from 'recompose/shallowEqual'; import autoPrefix from '../utils/autoPrefix'; @@ -7,17 +7,17 @@ import ScaleInTransitionGroup from './ScaleIn'; const pulsateDuration = 750; -class FocusRipple extends React.Component { +class FocusRipple extends Component { static propTypes = { - color: React.PropTypes.string, - innerStyle: React.PropTypes.object, - opacity: React.PropTypes.number, - show: React.PropTypes.bool, - style: React.PropTypes.object, + color: PropTypes.string, + innerStyle: PropTypes.object, + opacity: PropTypes.number, + show: PropTypes.bool, + style: PropTypes.object, }; static contextTypes = { - muiTheme: React.PropTypes.object.isRequired, + muiTheme: PropTypes.object.isRequired, }; componentDidMount() { diff --git a/src/internal/Overlay.js b/src/internal/Overlay.js index fc88420173f44e..eeaaedd5c97d7b 100644 --- a/src/internal/Overlay.js +++ b/src/internal/Overlay.js @@ -1,4 +1,4 @@ -import React from 'react'; +import React, {Component, PropTypes} from 'react'; import transitions from '../styles/transitions'; import AutoLockScrolling from './AutoLockScrolling'; @@ -38,16 +38,16 @@ function getStyles(props, context) { return style; } -class Overlay extends React.Component { +class Overlay extends Component { static propTypes = { - autoLockScrolling: React.PropTypes.bool, - show: React.PropTypes.bool.isRequired, + autoLockScrolling: PropTypes.bool, + show: PropTypes.bool.isRequired, /** * Override the inline-styles of the root element. */ - style: React.PropTypes.object, - transitionEnabled: React.PropTypes.bool, + style: PropTypes.object, + transitionEnabled: PropTypes.bool, }; static defaultProps = { @@ -57,7 +57,7 @@ class Overlay extends React.Component { }; static contextTypes = { - muiTheme: React.PropTypes.object.isRequired, + muiTheme: PropTypes.object.isRequired, }; setOpacity(opacity) { diff --git a/src/internal/RenderToLayer.js b/src/internal/RenderToLayer.js index 4c4fbeff99a304..f04dbe4f51fb07 100644 --- a/src/internal/RenderToLayer.js +++ b/src/internal/RenderToLayer.js @@ -1,14 +1,14 @@ -import React from 'react'; +import {Component, PropTypes} from 'react'; import ReactDOM from 'react-dom'; import Dom from '../utils/dom'; // heavily inspired by https://github.com/Khan/react-components/blob/master/js/layered-component-mixin.jsx -class RenderToLayer extends React.Component { +class RenderToLayer extends Component { static propTypes = { - componentClickAway: React.PropTypes.func, - open: React.PropTypes.bool.isRequired, - render: React.PropTypes.func.isRequired, - useLayerForClickAway: React.PropTypes.bool, + componentClickAway: PropTypes.func, + open: PropTypes.bool.isRequired, + render: PropTypes.func.isRequired, + useLayerForClickAway: PropTypes.bool, }; static defaultProps = { @@ -16,7 +16,7 @@ class RenderToLayer extends React.Component { }; static contextTypes = { - muiTheme: React.PropTypes.object.isRequired, + muiTheme: PropTypes.object.isRequired, }; componentDidMount() { diff --git a/src/internal/ScaleIn.js b/src/internal/ScaleIn.js index 0466b5eb032d99..c102c89a8ec1f5 100644 --- a/src/internal/ScaleIn.js +++ b/src/internal/ScaleIn.js @@ -1,19 +1,19 @@ -import React from 'react'; +import React, {Component, PropTypes} from 'react'; import ReactTransitionGroup from 'react-addons-transition-group'; import ScaleInChild from './ScaleInChild'; -class ScaleIn extends React.Component { +class ScaleIn extends Component { static propTypes = { - childStyle: React.PropTypes.object, - children: React.PropTypes.node, - enterDelay: React.PropTypes.number, - maxScale: React.PropTypes.number, - minScale: React.PropTypes.number, + childStyle: PropTypes.object, + children: PropTypes.node, + enterDelay: PropTypes.number, + maxScale: PropTypes.number, + minScale: PropTypes.number, /** * Override the inline-styles of the root element. */ - style: React.PropTypes.object, + style: PropTypes.object, }; static defaultProps = { @@ -21,7 +21,7 @@ class ScaleIn extends React.Component { }; static contextTypes = { - muiTheme: React.PropTypes.object.isRequired, + muiTheme: PropTypes.object.isRequired, }; render() { diff --git a/src/internal/ScaleInChild.js b/src/internal/ScaleInChild.js index 25a6d17be6ce2c..6241707660eddd 100644 --- a/src/internal/ScaleInChild.js +++ b/src/internal/ScaleInChild.js @@ -1,15 +1,15 @@ -import React from 'react'; +import React, {Component, PropTypes} from 'react'; import ReactDOM from 'react-dom'; import autoPrefix from '../utils/autoPrefix'; import transitions from '../styles/transitions'; -class ScaleInChild extends React.Component { +class ScaleInChild extends Component { static propTypes = { - children: React.PropTypes.node, - enterDelay: React.PropTypes.number, - maxScale: React.PropTypes.number, - minScale: React.PropTypes.number, - style: React.PropTypes.object, + children: PropTypes.node, + enterDelay: PropTypes.number, + maxScale: PropTypes.number, + minScale: PropTypes.number, + style: PropTypes.object, }; static defaultProps = { @@ -19,7 +19,7 @@ class ScaleInChild extends React.Component { }; static contextTypes = { - muiTheme: React.PropTypes.object.isRequired, + muiTheme: PropTypes.object.isRequired, }; componentWillUnmount() { diff --git a/src/internal/SlideIn.js b/src/internal/SlideIn.js index 0f34e4ad78c5d9..2993a218e2a1ed 100644 --- a/src/internal/SlideIn.js +++ b/src/internal/SlideIn.js @@ -1,14 +1,14 @@ -import React from 'react'; +import React, {Component, PropTypes} from 'react'; import ReactTransitionGroup from 'react-addons-transition-group'; import SlideInChild from './SlideInChild'; -class SlideIn extends React.Component { +class SlideIn extends Component { static propTypes = { - childStyle: React.PropTypes.object, - children: React.PropTypes.node, - direction: React.PropTypes.oneOf(['left', 'right', 'up', 'down']), - enterDelay: React.PropTypes.number, - style: React.PropTypes.object, + childStyle: PropTypes.object, + children: PropTypes.node, + direction: PropTypes.oneOf(['left', 'right', 'up', 'down']), + enterDelay: PropTypes.number, + style: PropTypes.object, }; static defaultProps = { @@ -17,7 +17,7 @@ class SlideIn extends React.Component { }; static contextTypes = { - muiTheme: React.PropTypes.object.isRequired, + muiTheme: PropTypes.object.isRequired, }; getLeaveDirection = () => { diff --git a/src/internal/SlideInChild.js b/src/internal/SlideInChild.js index 96edf32cd2a4d5..fcd6b66723b19c 100644 --- a/src/internal/SlideInChild.js +++ b/src/internal/SlideInChild.js @@ -1,16 +1,16 @@ -import React from 'react'; +import React, {Component, PropTypes} from 'react'; import ReactDOM from 'react-dom'; import autoPrefix from '../utils/autoPrefix'; import transitions from '../styles/transitions'; -class SlideInChild extends React.Component { +class SlideInChild extends Component { static propTypes = { - children: React.PropTypes.node, - direction: React.PropTypes.string, - enterDelay: React.PropTypes.number, + children: PropTypes.node, + direction: PropTypes.string, + enterDelay: PropTypes.number, // This callback is needed bacause the direction could change when leaving the DOM - getLeaveDirection: React.PropTypes.func.isRequired, - style: React.PropTypes.object, + getLeaveDirection: PropTypes.func.isRequired, + style: PropTypes.object, }; static defaultProps = { @@ -18,7 +18,7 @@ class SlideInChild extends React.Component { }; static contextTypes = { - muiTheme: React.PropTypes.object.isRequired, + muiTheme: PropTypes.object.isRequired, }; componentWillUnmount() { diff --git a/src/internal/Tooltip.js b/src/internal/Tooltip.js index 47163834ba585c..7d141ed717911c 100644 --- a/src/internal/Tooltip.js +++ b/src/internal/Tooltip.js @@ -1,4 +1,4 @@ -import React from 'react'; +import React, {Component, PropTypes} from 'react'; import transitions from '../styles/transitions'; function getStyles(props, context, state) { @@ -77,26 +77,26 @@ function getStyles(props, context, state) { return styles; } -class Tooltip extends React.Component { +class Tooltip extends Component { static propTypes = { /** * The css class name of the root element. */ - className: React.PropTypes.string, - horizontalPosition: React.PropTypes.oneOf(['left', 'right', 'center']), - label: React.PropTypes.node.isRequired, - show: React.PropTypes.bool, + className: PropTypes.string, + horizontalPosition: PropTypes.oneOf(['left', 'right', 'center']), + label: PropTypes.node.isRequired, + show: PropTypes.bool, /** * Override the inline-styles of the root element. */ - style: React.PropTypes.object, - touch: React.PropTypes.bool, - verticalPosition: React.PropTypes.oneOf(['top', 'bottom']), + style: PropTypes.object, + touch: PropTypes.bool, + verticalPosition: PropTypes.oneOf(['top', 'bottom']), }; static contextTypes = { - muiTheme: React.PropTypes.object.isRequired, + muiTheme: PropTypes.object.isRequired, }; state = { diff --git a/src/internal/TouchRipple.js b/src/internal/TouchRipple.js index 3bc2b71d78c8b9..efbf1bff2b2377 100644 --- a/src/internal/TouchRipple.js +++ b/src/internal/TouchRipple.js @@ -1,4 +1,4 @@ -import React from 'react'; +import React, {Component, PropTypes} from 'react'; import ReactDOM from 'react-dom'; import ReactTransitionGroup from 'react-addons-transition-group'; import Dom from '../utils/dom'; @@ -15,14 +15,14 @@ function shift(array) { return update(array, {$splice: [[0, 1]]}); } -class TouchRipple extends React.Component { +class TouchRipple extends Component { static propTypes = { - abortOnScroll: React.PropTypes.bool, - centerRipple: React.PropTypes.bool, - children: React.PropTypes.node, - color: React.PropTypes.string, - opacity: React.PropTypes.number, - style: React.PropTypes.object, + abortOnScroll: PropTypes.bool, + centerRipple: PropTypes.bool, + children: PropTypes.node, + color: PropTypes.string, + opacity: PropTypes.number, + style: PropTypes.object, }; static defaultProps = { @@ -30,7 +30,7 @@ class TouchRipple extends React.Component { }; static contextTypes = { - muiTheme: React.PropTypes.object.isRequired, + muiTheme: PropTypes.object.isRequired, }; constructor(props, context) { diff --git a/src/styles/muiThemeable.js b/src/styles/muiThemeable.js index f81474c7adfb86..c527fdcfbab458 100644 --- a/src/styles/muiThemeable.js +++ b/src/styles/muiThemeable.js @@ -1,4 +1,4 @@ -import React from 'react'; +import React, {Component, PropTypes} from 'react'; import getMuiTheme from './getMuiTheme'; let DEFAULT_THEME; @@ -19,7 +19,7 @@ export default function muiThemeable() { }; MuiComponent.contextTypes = { - muiTheme: React.PropTypes.object.isRequired, + muiTheme: PropTypes.object.isRequired, }; return MuiComponent; diff --git a/src/styles/themeDecorator.js b/src/styles/themeDecorator.js index bd89ed6261f180..0d279be112971d 100644 --- a/src/styles/themeDecorator.js +++ b/src/styles/themeDecorator.js @@ -1,4 +1,4 @@ -import React from 'react'; +import React, {PropTypes} from 'react'; import warning from 'warning'; export default (customTheme) => { @@ -7,7 +7,7 @@ export default (customTheme) => { return function(Component) { return React.createClass({ childContextTypes: { - muiTheme: React.PropTypes.object.isRequired, + muiTheme: PropTypes.object.isRequired, }, getChildContext() { diff --git a/src/utils/propTypes.js b/src/utils/propTypes.js index ee847fa2183d23..56e86c7517117c 100644 --- a/src/utils/propTypes.js +++ b/src/utils/propTypes.js @@ -1,11 +1,11 @@ -import React from 'react'; +import {PropTypes} from 'react'; -const horizontal = React.PropTypes.oneOf(['left', 'middle', 'right']); -const vertical = React.PropTypes.oneOf(['top', 'center', 'bottom']); +const horizontal = PropTypes.oneOf(['left', 'middle', 'right']); +const vertical = PropTypes.oneOf(['top', 'center', 'bottom']); export default { - corners: React.PropTypes.oneOf([ + corners: PropTypes.oneOf([ 'bottom-left', 'bottom-right', 'top-left', @@ -16,12 +16,12 @@ export default { vertical: vertical, - origin: React.PropTypes.shape({ + origin: PropTypes.shape({ horizontal: horizontal, vertical: vertical, }), - cornersAndCenter: React.PropTypes.oneOf([ + cornersAndCenter: PropTypes.oneOf([ 'bottom-center', 'bottom-left', 'bottom-right', @@ -30,11 +30,11 @@ export default { 'top-right', ]), - stringOrNumber: React.PropTypes.oneOfType([ - React.PropTypes.string, - React.PropTypes.number, + stringOrNumber: PropTypes.oneOfType([ + PropTypes.string, + PropTypes.number, ]), - zDepth: React.PropTypes.oneOf([0, 1, 2, 3, 4, 5]), + zDepth: PropTypes.oneOf([0, 1, 2, 3, 4, 5]), }; diff --git a/src/utils/stylePropable.js b/src/utils/stylePropable.js index 2e51697e6128d8..c433e18ecc55e1 100644 --- a/src/utils/stylePropable.js +++ b/src/utils/stylePropable.js @@ -1,4 +1,4 @@ -import React from 'react'; +import {PropTypes} from 'react'; import warning from 'warning'; let hasWarned; @@ -16,7 +16,7 @@ export const mergeStyles = (...args) => { export default { propTypes: { - style: React.PropTypes.object, + style: PropTypes.object, }, mergeStyles,