[Tab] Add style for disabled tab

mui · Feb 11, 2017 · dd11932 · dd11932
1 parent c8db0a8
commit dd11932
Showing 1 changed file with 10 additions and 0 deletions.
diff --git a/src/Tabs/Tab.js b/src/Tabs/Tab.js
@@ -29,13 +29,19 @@ export const styleSheet = createStyleSheet('Tab', (theme) => {
     rootAccentSelected: {
       color: theme.palette.accent[500],
     },
+    rootAccentDisabled: {
+      color: theme.palette.text.disabled,
+    },
     rootInherit: {
       color: 'inherit',
       opacity: 0.7,
     },
     rootInheritSelected: {
       opacity: 1,
     },
+    rootInheritDisabled: {
+      opacity: 0.4,
+    },
     label: {
       fontSize: theme.typography.fontSize,
       fontWeight: theme.typography.fontWeightMedium,
@@ -138,6 +144,7 @@ export default class Tab extends Component {
       selected,
       style: styleProp,
       textColor,
+      disabled,
       ...other
     } = this.props;
 
@@ -163,8 +170,10 @@ export default class Tab extends Component {
 
     const className = classNames(classes.root, {
       [classes.rootAccent]: textColor === 'accent',
+      [classes.rootAccentDisabled]: disabled && textColor === 'accent',
       [classes.rootAccentSelected]: selected && textColor === 'accent',
       [classes.rootInherit]: textColor === 'inherit',
+      [classes.rootInheritDisabled]: disabled && textColor === 'inherit',
       [classes.rootInheritSelected]: selected && textColor === 'inherit',
       [classes.rootLabelIcon]: icon && label,
     }, classNameProp);
@@ -191,6 +200,7 @@ export default class Tab extends Component {
         style={style}
         role="tab"
         aria-selected={selected}
+        disabled={disabled}
         {...other}
         onClick={this.handleChange}
       >