[BottomNavigation] Rename BottomNavigationButton to BottomNavigationAction

CHANGELOG.md

@@ -30,7 +30,7 @@ None, merry christmas 🎄.
 - [Select] Typo fix (#9567) @bordagabor
 - [CardHeader] Add conditional rendering of the subheader (#9572) @jwwisgerhof
 - [Tooltip] children should be an element (#9568) @oliviertassinari
-- [BottomNavigationButton] onClick and onChange handler overwritten (#9564) @kgregory
+- [BottomNavigationAction] onClick and onChange handler overwritten (#9564) @kgregory
 - [typescript] Add typings to reactHelpers (#9565) @SSW-SCIENTIFIC
 - [TablePagination] Make onChangeRowsPerPage optional (#9563) @evantrimboli
 - [Toolbar] Make the children optional (#9581) @oliviertassinari
@@ -1292,7 +1292,7 @@ If you want to avoid the default browser required property handling, you can add
 - [FormControlLabel] Allow for node in the label prop (#7903) @Taldrain
 - [ListItemIcon] Icon should not shrink fixes (#7917) @gulderov
 - [withResponsiveFullScreen] missed type import (#7926) @rosskevin
-- [typescript] Fixes/improvements for withWith/withStyle/BottomNavigationButton (#7897) @sebald
+- [typescript] Fixes/improvements for withWith/withStyle/BottomNavigationAction (#7897) @sebald
 - [typescript] Update typings to popover changes (#7937) @sebald
 - [Popover] Expose the component (#7927) @oliviertassinari
 - [ButtonBase] Better warning message (#7904) @oliviertassinari

docs/src/pages/demos/bottom-navigation/LabelBottomNavigation.js

@@ -1,7 +1,7 @@
 import React from 'react';
 import PropTypes from 'prop-types';
 import { withStyles } from 'material-ui/styles';
-import BottomNavigation, { BottomNavigationButton } from 'material-ui/BottomNavigation';
+import BottomNavigation, { BottomNavigationAction } from 'material-ui/BottomNavigation';
 import RestoreIcon from 'material-ui-icons/Restore';
 import FavoriteIcon from 'material-ui-icons/Favorite';
 import LocationOnIcon from 'material-ui-icons/LocationOn';
@@ -28,10 +28,10 @@ class LabelBottomNavigation extends React.Component {
 
     return (
       <BottomNavigation value={value} onChange={this.handleChange} className={classes.root}>
-        <BottomNavigationButton label="Recents" value="recents" icon={<RestoreIcon />} />
-        <BottomNavigationButton label="Favorites" value="favorites" icon={<FavoriteIcon />} />
-        <BottomNavigationButton label="Nearby" value="nearby" icon={<LocationOnIcon />} />
-        <BottomNavigationButton label="Folder" value="folder" icon={<FolderIcon />} />
+        <BottomNavigationAction label="Recents" value="recents" icon={<RestoreIcon />} />
+        <BottomNavigationAction label="Favorites" value="favorites" icon={<FavoriteIcon />} />
+        <BottomNavigationAction label="Nearby" value="nearby" icon={<LocationOnIcon />} />
+        <BottomNavigationAction label="Folder" value="folder" icon={<FolderIcon />} />
       </BottomNavigation>
     );
   }

docs/src/pages/demos/bottom-navigation/SimpleBottomNavigation.js

@@ -1,7 +1,7 @@
 import React from 'react';
 import PropTypes from 'prop-types';
 import { withStyles } from 'material-ui/styles';
-import BottomNavigation, { BottomNavigationButton } from 'material-ui/BottomNavigation';
+import BottomNavigation, { BottomNavigationAction } from 'material-ui/BottomNavigation';
 import RestoreIcon from 'material-ui-icons/Restore';
 import FavoriteIcon from 'material-ui-icons/Favorite';
 import LocationOnIcon from 'material-ui-icons/LocationOn';
@@ -32,9 +32,9 @@ class SimpleBottomNavigation extends React.Component {
         showLabels
         className={classes.root}
       >
-        <BottomNavigationButton label="Recents" icon={<RestoreIcon />} />
-        <BottomNavigationButton label="Favorites" icon={<FavoriteIcon />} />
-        <BottomNavigationButton label="Nearby" icon={<LocationOnIcon />} />
+        <BottomNavigationAction label="Recents" icon={<RestoreIcon />} />
+        <BottomNavigationAction label="Favorites" icon={<FavoriteIcon />} />
+        <BottomNavigationAction label="Nearby" icon={<LocationOnIcon />} />
       </BottomNavigation>
     );
   }

docs/src/pages/demos/bottom-navigation/bottom-navigation.md

@@ -1,5 +1,5 @@
 ---
-components: BottomNavigation, BottomNavigationButton
+components: BottomNavigation, BottomNavigationAction
 ---
 
 # Bottom Navigation

pages/api/bottom-navigation-button.js → pages/api/bottom-navigation-action.js

@@ -1,7 +1,7 @@
 import React from 'react';
 import withRoot from 'docs/src/modules/components/withRoot';
 import MarkdownDocs from 'docs/src/modules/components/MarkdownDocs';
-import markdown from './bottom-navigation-button.md';
+import markdown from './bottom-navigation-action.md';
 
 function Page() {
   return <MarkdownDocs markdown={markdown} />;

pages/api/bottom-navigation-button.md → pages/api/bottom-navigation-action.md

@@ -1,10 +1,10 @@
 ---
-filename: /src/BottomNavigation/BottomNavigationButton.js
+filename: /src/BottomNavigation/BottomNavigationAction.js
 ---
 
 <!--- This documentation is automatically generated, do not try to edit it. -->
 
-# BottomNavigationButton
+# BottomNavigationAction
 
 
 
@@ -15,7 +15,7 @@ filename: /src/BottomNavigation/BottomNavigationButton.js
 | classes | object |  | Useful to extend the style applied to components. |
 | icon | node |  | The icon element. If a string is provided, it will be used as a font ligature. |
 | label | node |  | The label element. |
-| showLabel | bool |  | If `true`, the BottomNavigationButton will show its label. |
+| showLabel | bool |  | If `true`, the BottomNavigationAction will show its label. |
 | value | any |  | You can provide your own value. Otherwise, we fallback to the child position index. |
 
 Any other properties supplied will be [spread to the root element](/guides/api#spread).
@@ -34,12 +34,12 @@ This property accepts the following keys:
 - `icon`
 
 Have a look at [overriding with classes](/customization/overrides#overriding-with-classes) section
-and the [implementation of the component](https://github.com/mui-org/material-ui/tree/v1-beta/src/BottomNavigation/BottomNavigationButton.js)
+and the [implementation of the component](https://github.com/mui-org/material-ui/tree/v1-beta/src/BottomNavigation/BottomNavigationAction.js)
 for more detail.
 
 If using the `overrides` key of the theme as documented
 [here](/customization/themes#customizing-all-instances-of-a-component-type),
-you need to use the following style sheet name: `MuiBottomNavigationButton`.
+you need to use the following style sheet name: `MuiBottomNavigationAction`.
 
 ## Inheritance
 

pages/api/bottom-navigation.md

@@ -15,8 +15,8 @@ filename: /src/BottomNavigation/BottomNavigation.js
 | <span style="color: #31a148">children *</span> | node |  | The content of the component. |
 | classes | object |  | Useful to extend the style applied to components. |
 | onChange | func |  | Callback fired when the value changes.<br><br>**Signature:**<br>`function(event: object, value: any) => void`<br>*event:* The event source of the callback<br>*value:* We default to the index of the child |
-| showLabels | bool | false | If `true`, all `BottomNavigationButton`s will show their labels. By default only the selected `BottomNavigationButton` will show its label. |
-| value | any |  | The value of the currently selected `BottomNavigationButton`. |
+| showLabels | bool | false | If `true`, all `BottomNavigationAction`s will show their labels. By default only the selected `BottomNavigationAction` will show its label. |
+| value | any |  | The value of the currently selected `BottomNavigationAction`. |
 
 Any other properties supplied will be [spread to the root element](/guides/api#spread).
 

src/BottomNavigation/BottomNavigation.js

@@ -67,12 +67,12 @@ BottomNavigation.propTypes = {
    */
   onChange: PropTypes.func,
   /**
-   * If `true`, all `BottomNavigationButton`s will show their labels.
-   * By default only the selected `BottomNavigationButton` will show its label.
+   * If `true`, all `BottomNavigationAction`s will show their labels.
+   * By default only the selected `BottomNavigationAction` will show its label.
    */
   showLabels: PropTypes.bool,
   /**
-   * The value of the currently selected `BottomNavigationButton`.
+   * The value of the currently selected `BottomNavigationAction`.
    */
   value: PropTypes.any,
 };

src/BottomNavigation/BottomNavigation.spec.js

@@ -2,7 +2,7 @@ import React from 'react';
 import { assert } from 'chai';
 import { spy } from 'sinon';
 import { createShallow, createMount, getClasses } from '../test-utils';
-import BottomNavigationButton from './BottomNavigationButton';
+import BottomNavigationAction from './BottomNavigationAction';
 import Icon from '../Icon';
 import BottomNavigation from './BottomNavigation';
 
@@ -16,7 +16,7 @@ describe('<BottomNavigation />', () => {
     shallow = createShallow({ dive: true });
     classes = getClasses(
       <BottomNavigation showLabels value={0}>
-        <BottomNavigationButton icon={icon} />
+        <BottomNavigationAction icon={icon} />
       </BottomNavigation>,
     );
     mount = createMount();
@@ -29,18 +29,18 @@ describe('<BottomNavigation />', () => {
   it('renders with a null child', () => {
     const wrapper = shallow(
       <BottomNavigation showLabels value={0}>
-        <BottomNavigationButton label="One" />
+        <BottomNavigationAction label="One" />
         {null}
-        <BottomNavigationButton label="Three" />
+        <BottomNavigationAction label="Three" />
       </BottomNavigation>,
     );
-    assert.strictEqual(wrapper.find(BottomNavigationButton).length, 2);
+    assert.strictEqual(wrapper.find(BottomNavigationAction).length, 2);
   });
 
   it('should render with the root class', () => {
     const wrapper = shallow(
       <BottomNavigation showLabels value={0}>
-        <BottomNavigationButton icon={icon} />
+        <BottomNavigationAction icon={icon} />
       </BottomNavigation>,
     );
     assert.strictEqual(wrapper.name(), 'div');
@@ -50,7 +50,7 @@ describe('<BottomNavigation />', () => {
   it('should render with the user and root classes', () => {
     const wrapper = shallow(
       <BottomNavigation showLabels value={0} className="woofBottomNavigation">
-        <BottomNavigationButton icon={icon} />
+        <BottomNavigationAction icon={icon} />
       </BottomNavigation>,
     );
     assert.strictEqual(wrapper.hasClass('woofBottomNavigation'), true);
@@ -60,8 +60,8 @@ describe('<BottomNavigation />', () => {
   it('should pass selected prop to children', () => {
     const wrapper = shallow(
       <BottomNavigation showLabels value={1}>
-        <BottomNavigationButton icon={icon} />
-        <BottomNavigationButton icon={icon} />
+        <BottomNavigationAction icon={icon} />
+        <BottomNavigationAction icon={icon} />
       </BottomNavigation>,
     );
     assert.strictEqual(wrapper.childAt(0).props().selected, false, 'should have selected to false');
@@ -71,8 +71,8 @@ describe('<BottomNavigation />', () => {
   it('should overwrite parent showLabel prop', () => {
     const wrapper = shallow(
       <BottomNavigation showLabels value={1}>
-        <BottomNavigationButton icon={icon} />
-        <BottomNavigationButton icon={icon} showLabel={false} />
+        <BottomNavigationAction icon={icon} />
+        <BottomNavigationAction icon={icon} showLabel={false} />
       </BottomNavigation>,
     );
     assert.strictEqual(wrapper.childAt(0).props().showLabel, true, 'should have parent showLabel');
@@ -83,12 +83,12 @@ describe('<BottomNavigation />', () => {
     const handleChange = spy();
     const wrapper = mount(
       <BottomNavigation showLabels value={0} onChange={handleChange}>
-        <BottomNavigationButton icon={icon} />
-        <BottomNavigationButton icon={icon} />
+        <BottomNavigationAction icon={icon} />
+        <BottomNavigationAction icon={icon} />
       </BottomNavigation>,
     );
     wrapper
-      .find(BottomNavigationButton)
+      .find(BottomNavigationAction)
       .at(1)
       .simulate('click');
     assert.strictEqual(handleChange.callCount, 1, 'should have been called once');

src/BottomNavigation/BottomNavigationButton.d.ts → src/BottomNavigation/BottomNavigationAction.d.ts

@@ -2,8 +2,8 @@ import * as React from 'react';
 import { StandardProps } from '..';
 import { ButtonBaseProps, ButtonBaseClassKey } from '../ButtonBase';
 
-export interface BottomNavigationButtonProps
-  extends StandardProps<ButtonBaseProps, BottomNavigationButtonClassKey, 'onChange'> {
+export interface BottomNavigationActionProps
+  extends StandardProps<ButtonBaseProps, BottomNavigationActionClassKey, 'onChange'> {
   icon?: string | React.ReactElement<any>;
   label?: React.ReactNode;
   onChange?: (event: React.ChangeEvent<{}>, value: any) => void;
@@ -13,7 +13,7 @@ export interface BottomNavigationButtonProps
   value?: any;
 }
 
-export type BottomNavigationButtonClassKey =
+export type BottomNavigationActionClassKey =
   | ButtonBaseClassKey
   | 'selected'
   | 'selectedIconOnly'
@@ -23,6 +23,6 @@ export type BottomNavigationButtonClassKey =
   | 'hiddenLabel'
   | 'icon';
 
-declare const BottomNavigationButton: React.ComponentType<BottomNavigationButtonProps>;
+declare const BottomNavigationAction: React.ComponentType<BottomNavigationActionProps>;
 
-export default BottomNavigationButton;
+export default BottomNavigationAction;

src/BottomNavigation/BottomNavigationButton.js → src/BottomNavigation/BottomNavigationAction.js

@@ -55,7 +55,7 @@ export const styles = theme => ({
   },
 });
 
-class BottomNavigationButton extends React.Component {
+class BottomNavigationAction extends React.Component {
   handleChange = event => {
     const { onChange, value, onClick } = this.props;
 
@@ -119,7 +119,7 @@ class BottomNavigationButton extends React.Component {
   }
 }
 
-BottomNavigationButton.propTypes = {
+BottomNavigationAction.propTypes = {
   /**
    * Useful to extend the style applied to components.
    */
@@ -149,7 +149,7 @@ BottomNavigationButton.propTypes = {
    */
   selected: PropTypes.bool,
   /**
-   * If `true`, the BottomNavigationButton will show its label.
+   * If `true`, the BottomNavigationAction will show its label.
    */
   showLabel: PropTypes.bool,
   /**
@@ -158,4 +158,4 @@ BottomNavigationButton.propTypes = {
   value: PropTypes.any,
 };
 
-export default withStyles(styles, { name: 'MuiBottomNavigationButton' })(BottomNavigationButton);
+export default withStyles(styles, { name: 'MuiBottomNavigationAction' })(BottomNavigationAction);