sebastian review

mui · Feb 9, 2020 · 2b6c887 · 2b6c887
1 parent 94902e8
commit 2b6c887
Show file tree

Hide file tree

Showing 14 changed files with 58 additions and 58 deletions.
diff --git a/docs/pages/api/pagination-item.md b/docs/pages/api/pagination-item.md
@@ -31,8 +31,8 @@ You can learn more about the difference by [reading this guide](/guides/minimizi
 | <span class="prop-name">selected</span> | <span class="prop-type">bool</span> | <span class="prop-default">false</span> | If `true` the pagination item is selected. |
 | <span class="prop-name">shape</span> | <span class="prop-type">'round'<br>&#124;&nbsp;'rounded'</span> | <span class="prop-default">'round'</span> | The shape of the pagination item. |
 | <span class="prop-name">size</span> | <span class="prop-type">'small'<br>&#124;&nbsp;'medium'<br>&#124;&nbsp;'large'</span> | <span class="prop-default">'medium'</span> | The size of the pagination item. |
-| <span class="prop-name">type</span> | <span class="prop-type">'page'<br>&#124;&nbsp;'first'<br>&#124;&nbsp;'last'<br>&#124;&nbsp;'next'<br>&#124;&nbsp;'previous'<br>&#124;&nbsp;'start-ellipsis'<br>&#124;&nbsp;'end-ellipsis'</span> | <span class="prop-default">'page'</span> |  |
-| <span class="prop-name">variant</span> | <span class="prop-type">'text'<br>&#124;&nbsp;'outlined'</span> |  |  |
+| <span class="prop-name">type</span> | <span class="prop-type">'page'<br>&#124;&nbsp;'first'<br>&#124;&nbsp;'last'<br>&#124;&nbsp;'next'<br>&#124;&nbsp;'previous'<br>&#124;&nbsp;'start-ellipsis'<br>&#124;&nbsp;'end-ellipsis'</span> | <span class="prop-default">'page'</span> | The type of pagination item. |
+| <span class="prop-name">variant</span> | <span class="prop-type">'text'<br>&#124;&nbsp;'outlined'</span> | <span class="prop-default">'text'</span> | The pagination item variant. |
 
 The `ref` is forwarded to the root element.
 

diff --git a/packages/material-ui-lab/src/Pagination/Pagination.test.js b/packages/material-ui-lab/src/Pagination/Pagination.test.js
@@ -8,10 +8,10 @@ import Pagination from './Pagination';
 describe('<Pagination />', () => {
   let classes;
   let mount;
-  const render = createClientRender({ strict: false });
+  const render = createClientRender();
 
   before(() => {
-    mount = createMount();
+    mount = createMount({ strict: true });
     classes = getClasses(<Pagination />);
   });
 

diff --git a/packages/material-ui-lab/src/PaginationItem/PaginationItem.js b/packages/material-ui-lab/src/PaginationItem/PaginationItem.js
@@ -204,7 +204,7 @@ const PaginationItem = React.forwardRef(function PaginationItem(props, ref) {
     shape = 'round',
     size = 'medium',
     type = 'page',
-    variant,
+    variant = 'text',
     ...other
   } = props;
 
@@ -286,7 +286,7 @@ PaginationItem.propTypes = {
    * The size of the pagination item.
    */
   size: PropTypes.oneOf(['small', 'medium', 'large']),
-  /*
+  /**
    * The type of pagination item.
    */
   type: PropTypes.oneOf([
@@ -298,7 +298,7 @@ PaginationItem.propTypes = {
     'start-ellipsis',
     'end-ellipsis',
   ]),
-  /*
+  /**
    * The pagination item variant.
    */
   variant: PropTypes.oneOf(['text', 'outlined']),

diff --git a/packages/material-ui-lab/src/PaginationItem/PaginationItem.test.js b/packages/material-ui-lab/src/PaginationItem/PaginationItem.test.js
@@ -8,10 +8,10 @@ import PaginationItem from './PaginationItem';
 describe('<PaginationItem />', () => {
   let classes;
   let mount;
-  const render = createClientRender({ strict: false });
+  const render = createClientRender();
 
   before(() => {
-    mount = createMount();
+    mount = createMount({ strict: true });
     classes = getClasses(<PaginationItem />);
   });
 
@@ -55,10 +55,10 @@ describe('<PaginationItem />', () => {
       </PaginationItem>,
     );
 
-    const rootNode = getByTestId('root');
-    expect(rootNode).to.have.class(classes.root);
-    expect(rootNode).to.have.class(classes.sizeSmall);
-    expect(rootNode).not.to.have.class(classes.sizeLarge);
+    const root = getByTestId('root');
+    expect(root).to.have.class(classes.root);
+    expect(root).to.have.class(classes.sizeSmall);
+    expect(root).not.to.have.class(classes.sizeLarge);
   });
 
   it('should render a large button', () => {
@@ -68,9 +68,9 @@ describe('<PaginationItem />', () => {
       </PaginationItem>,
     );
 
-    const rootNode = getByTestId('root');
-    expect(rootNode).to.have.class(classes.root);
-    expect(rootNode).not.to.have.class(classes.sizeSmall);
-    expect(rootNode).to.have.class(classes.sizeLarge);
+    const root = getByTestId('root');
+    expect(root).to.have.class(classes.root);
+    expect(root).not.to.have.class(classes.sizeSmall);
+    expect(root).to.have.class(classes.sizeLarge);
   });
 });
diff --git a/packages/material-ui-lab/src/Rating/Rating.js b/packages/material-ui-lab/src/Rating/Rating.js
@@ -40,7 +40,7 @@ export const styles = theme => ({
     cursor: 'pointer',
     WebkitTapHighlightColor: 'transparent',
     '&$disabled': {
-      opacity: theme.palette.action.disabledOpacity,
+      opacity: 0.5,
       pointerEvents: 'none',
     },
     '&$focusVisible $iconActive': {

diff --git a/packages/material-ui-lab/src/ToggleButton/ToggleButton.test.js b/packages/material-ui-lab/src/ToggleButton/ToggleButton.test.js
@@ -54,10 +54,10 @@ describe('<ToggleButton />', () => {
       </ToggleButton>,
     );
 
-    const rootNode = getByTestId('root');
-    expect(rootNode).to.have.class(classes.root);
-    expect(rootNode).to.have.class(classes.sizeSmall);
-    expect(rootNode).not.to.have.class(classes.sizeLarge);
+    const root = getByTestId('root');
+    expect(root).to.have.class(classes.root);
+    expect(root).to.have.class(classes.sizeSmall);
+    expect(root).not.to.have.class(classes.sizeLarge);
   });
 
   it('should render a large button', () => {
@@ -67,10 +67,10 @@ describe('<ToggleButton />', () => {
       </ToggleButton>,
     );
 
-    const rootNode = getByTestId('root');
-    expect(rootNode).to.have.class(classes.root);
-    expect(rootNode).not.to.have.class(classes.sizeSmall);
-    expect(rootNode).to.have.class(classes.sizeLarge);
+    const root = getByTestId('root');
+    expect(root).to.have.class(classes.root);
+    expect(root).not.to.have.class(classes.sizeSmall);
+    expect(root).to.have.class(classes.sizeLarge);
   });
 
   describe('prop: onChange', () => {

diff --git a/packages/material-ui/src/Chip/Chip.js b/packages/material-ui/src/Chip/Chip.js
@@ -38,7 +38,7 @@ export const styles = theme => {
       verticalAlign: 'middle',
       boxSizing: 'border-box',
       '&$disabled': {
-        opacity: theme.palette.action.disabledOpacity,
+        opacity: 0.5,
         pointerEvents: 'none',
       },
       '& $avatar': {

diff --git a/packages/material-ui/src/FilledInput/FilledInput.test.js b/packages/material-ui/src/FilledInput/FilledInput.test.js
@@ -27,13 +27,13 @@ describe('<FilledInput />', () => {
 
   it('should have the underline class', () => {
     const { container } = render(<FilledInput />);
-    const rootNode = container.firstChild;
-    expect(rootNode).to.have.class(classes.underline);
+    const root = container.firstChild;
+    expect(root).to.have.class(classes.underline);
   });
 
   it('can disable the underline', () => {
     const { container } = render(<FilledInput disableUnderline />);
-    const rootNode = container.firstChild;
-    expect(rootNode).not.to.have.class(classes.underline);
+    const root = container.firstChild;
+    expect(root).not.to.have.class(classes.underline);
   });
 });
diff --git a/packages/material-ui/src/FormControl/FormControl.test.js b/packages/material-ui/src/FormControl/FormControl.test.js
@@ -40,26 +40,26 @@ describe('<FormControl />', () => {
   describe('initial state', () => {
     it('should have no margin', () => {
       const { container } = render(<FormControl />);
-      const rootNode = container.firstChild;
+      const root = container.firstChild;
 
-      expect(rootNode).not.to.have.class(classes.marginNormal);
-      expect(rootNode).not.to.have.class(classes.marginDense);
+      expect(root).not.to.have.class(classes.marginNormal);
+      expect(root).not.to.have.class(classes.marginDense);
     });
 
     it('can have the margin normal class', () => {
       const { container } = render(<FormControl margin="normal" />);
-      const rootNode = container.firstChild;
+      const root = container.firstChild;
 
-      expect(rootNode).to.have.class(classes.marginNormal);
-      expect(rootNode).not.to.have.class(classes.marginDense);
+      expect(root).to.have.class(classes.marginNormal);
+      expect(root).not.to.have.class(classes.marginDense);
     });
 
     it('can have the margin dense class', () => {
       const { container } = render(<FormControl margin="dense" />);
-      const rootNode = container.firstChild;
+      const root = container.firstChild;
 
-      expect(rootNode).to.have.class(classes.marginDense);
-      expect(rootNode).not.to.have.class(classes.marginNormal);
+      expect(root).to.have.class(classes.marginDense);
+      expect(root).not.to.have.class(classes.marginNormal);
     });
 
     it('should not be filled initially', () => {

diff --git a/packages/material-ui/src/FormControlLabel/FormControlLabel.test.js b/packages/material-ui/src/FormControlLabel/FormControlLabel.test.js
@@ -28,10 +28,10 @@ describe('<FormControlLabel />', () => {
 
   it('should render the label text inside an additional element', () => {
     const { container, getByText } = render(<FormControlLabel label="Pizza" control={<div />} />);
-    const rootNode = container.firstChild;
+    const root = container.firstChild;
 
-    expect(rootNode).to.have.property('nodeName', 'LABEL');
-    expect(rootNode).to.have.class(classes.root);
+    expect(root).to.have.property('nodeName', 'LABEL');
+    expect(root).to.have.class(classes.root);
     expect(getByText(/Pizza/)).not.to.have.class(classes.root);
     expect(getByText(/Pizza/)).to.have.class(classes.label);
   });
@@ -41,11 +41,11 @@ describe('<FormControlLabel />', () => {
       const { container, getByTestId, getByText } = render(
         <FormControlLabel label="Pizza" disabled control={<div data-testid="control" />} />,
       );
-      const rootNode = container.firstChild;
+      const root = container.firstChild;
       const control = getByTestId('control');
       const label = getByText(/Pizza/);
 
-      expect(rootNode).to.have.class(classes.disabled);
+      expect(root).to.have.class(classes.disabled);
       expect(control).to.have.attribute('disabled');
       expect(label).to.have.class(classes.disabled);
     });
@@ -58,11 +58,11 @@ describe('<FormControlLabel />', () => {
           control={<div data-testid="control" disabled />}
         />,
       );
-      const rootNode = container.firstChild;
+      const root = container.firstChild;
       const control = getByTestId('control');
       const label = getByText(/Pizza/);
 
-      expect(rootNode).to.have.class(classes.disabled);
+      expect(root).to.have.class(classes.disabled);
       expect(control).to.have.attribute('disabled');
       expect(label).to.have.class(classes.disabled);
     });

diff --git a/packages/material-ui/src/IconButton/IconButton.test.js b/packages/material-ui/src/IconButton/IconButton.test.js
@@ -84,15 +84,15 @@ describe('<IconButton />', () => {
 
   describe('prop: size', () => {
     it('should render the right class', () => {
-      let rootNode;
-      rootNode = render(<IconButton size="small">book</IconButton>).container.firstChild;
-      expect(rootNode).to.have.class(classes.sizeSmall);
+      let root;
+      root = render(<IconButton size="small">book</IconButton>).container.firstChild;
+      expect(root).to.have.class(classes.sizeSmall);
 
-      rootNode = render(<IconButton size="medium">book</IconButton>).container.firstChild;
-      expect(rootNode).not.to.have.class(classes.sizeSmall);
+      root = render(<IconButton size="medium">book</IconButton>).container.firstChild;
+      expect(root).not.to.have.class(classes.sizeSmall);
 
-      rootNode = render(<IconButton>book</IconButton>).container.firstChild;
-      expect(rootNode).not.to.have.class(classes.sizeSmall);
+      root = render(<IconButton>book</IconButton>).container.firstChild;
+      expect(root).not.to.have.class(classes.sizeSmall);
     });
   });
 

diff --git a/packages/material-ui/src/ListItem/ListItem.js b/packages/material-ui/src/ListItem/ListItem.js
@@ -29,7 +29,7 @@ export const styles = theme => ({
       backgroundColor: theme.palette.action.selected,
     },
     '&$disabled': {
-      opacity: theme.palette.action.disabledOpacity,
+      opacity: 0.5,
     },
   },
   /* Styles applied to the `container` element if `children` includes `ListItemSecondaryAction`. */

diff --git a/packages/material-ui/src/Tab/Tab.js b/packages/material-ui/src/Tab/Tab.js
@@ -43,7 +43,7 @@ export const styles = theme => ({
       opacity: 1,
     },
     '&$disabled': {
-      opacity: theme.palette.action.disabledOpacity,
+      opacity: 0.5,
     },
   },
   /* Styles applied to the root element if the parent [`Tabs`](/api/tabs/) has `textColor="primary"`. */

diff --git a/packages/material-ui/src/styles/createPalette.js b/packages/material-ui/src/styles/createPalette.js
@@ -40,7 +40,7 @@ export const light = {
     selected: 'rgba(0, 0, 0, 0.08)',
     selectedOpacity: 0.08,
     // The color of a disabled action.
-    disabled: 'rgba(0, 0, 0, 0.38)',
+    disabled: 'rgba(0, 0, 0, 0.26)',
     // The background color of a disabled action.
     disabledBackground: 'rgba(0, 0, 0, 0.12)',
     disabledOpacity: 0.38,
@@ -69,7 +69,7 @@ export const dark = {
     hoverOpacity: 0.08,
     selected: 'rgba(255, 255, 255, 0.16)',
     selectedOpacity: 0.16,
-    disabled: 'rgba(255, 255, 255, 0.38)',
+    disabled: 'rgba(255, 255, 255, 0.3)',
     disabledBackground: 'rgba(255, 255, 255, 0.12)',
     disabledOpacity: 0.38,
     focus: 'rgba(255, 255, 255, 0.12)',