-
-
Notifications
You must be signed in to change notification settings - Fork 32.4k
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
[Table] Use makeStyles over withStyles
- Loading branch information
1 parent
6e750ac
commit 6a643eb
Showing
13 changed files
with
183 additions
and
32 deletions.
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1 @@ | ||
export { default } from './useThemeProps'; |
15 changes: 15 additions & 0 deletions
15
packages/material-ui-styles/src/useThemeProps/useThemeProps.js
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,15 @@ | ||
import useTheme from '../useTheme'; | ||
import getThemeProps from '../getThemeProps'; | ||
|
||
function useThemeProps(props, options) { | ||
const { defaultTheme, name } = options; | ||
const theme = useTheme() || defaultTheme; | ||
const output = getThemeProps({ | ||
theme, | ||
name, | ||
props, | ||
}); | ||
return output; | ||
} | ||
|
||
export default useThemeProps; |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,9 @@ | ||
import { useThemeProps as useThemePropsWithoutDefault } from '@material-ui/styles'; | ||
import defaultTheme from './defaultTheme'; | ||
|
||
export default function useThemeProps(props, options) { | ||
return useThemePropsWithoutDefault(props, { | ||
defaultTheme, | ||
...options, | ||
}); | ||
} |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,49 @@ | ||
/* eslint-disable react/no-array-index-key */ | ||
|
||
import React from 'react'; | ||
import NoSsr from '@material-ui/core/NoSsr'; | ||
import Table from '@material-ui/core/Table'; | ||
import TableBody from '@material-ui/core/TableBody'; | ||
import TableCell from '@material-ui/core/TableCell'; | ||
import TableHead from '@material-ui/core/TableHead'; | ||
import TableRow from '@material-ui/core/TableRow'; | ||
|
||
function createData(name, calories, fat, carbs, protein) { | ||
return { name, calories, fat, carbs, protein }; | ||
} | ||
|
||
const data = createData('Frozen yoghurt', 159, 6.0, 24, 4.0); | ||
const rows = Array.from(new Array(100)).map(() => data); | ||
|
||
function TableMui() { | ||
return ( | ||
<NoSsr defer> | ||
<Table> | ||
<TableHead> | ||
<TableRow> | ||
<TableCell>Dessert (100g serving)</TableCell> | ||
<TableCell>Calories</TableCell> | ||
<TableCell>Fat (g)</TableCell> | ||
<TableCell>Carbs (g)</TableCell> | ||
<TableCell>Protein (g)</TableCell> | ||
</TableRow> | ||
</TableHead> | ||
<TableBody> | ||
{rows.map((row, index) => ( | ||
<TableRow key={index}> | ||
<TableCell component="th" scope="row"> | ||
{row.name} | ||
</TableCell> | ||
<TableCell>{row.calories}</TableCell> | ||
<TableCell>{row.fat}</TableCell> | ||
<TableCell>{row.carbs}</TableCell> | ||
<TableCell>{row.protein}</TableCell> | ||
</TableRow> | ||
))} | ||
</TableBody> | ||
</Table> | ||
</NoSsr> | ||
); | ||
} | ||
|
||
export default TableMui; |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,42 @@ | ||
/* eslint-disable react/no-array-index-key */ | ||
|
||
import React from 'react'; | ||
import NoSsr from '@material-ui/core/NoSsr'; | ||
|
||
function createData(name, calories, fat, carbs, protein) { | ||
return { name, calories, fat, carbs, protein }; | ||
} | ||
|
||
const data = createData('Frozen yoghurt', 159, 6.0, 24, 4.0); | ||
const rows = Array.from(new Array(100)).map(() => data); | ||
|
||
function TableRaw() { | ||
return ( | ||
<NoSsr defer> | ||
<table> | ||
<thead> | ||
<tr> | ||
<th>Dessert (100g serving)</th> | ||
<th>Calories</th> | ||
<th>Fat (g)</th> | ||
<th>Carbs (g)</th> | ||
<th>Protein (g)</th> | ||
</tr> | ||
</thead> | ||
<tbody> | ||
{rows.map((row, index) => ( | ||
<tr key={index}> | ||
<th scope="row">{row.name}</th> | ||
<td>{row.calories}</td> | ||
<td>{row.fat}</td> | ||
<td>{row.carbs}</td> | ||
<td>{row.protein}</td> | ||
</tr> | ||
))} | ||
</tbody> | ||
</table> | ||
</NoSsr> | ||
); | ||
} | ||
|
||
export default TableRaw; |