From 4542b2efc9b5781773ea910ad87e01c18684d36b Mon Sep 17 00:00:00 2001 From: Marija Najdova Date: Thu, 20 May 2021 14:14:59 +0200 Subject: [PATCH 1/5] init --- examples/simple-example/MessageButtons.js | 2 +- src/SnackbarContainer.tsx | 9 ++++++--- src/SnackbarContent/SnackbarContent.tsx | 7 +++++-- src/SnackbarItem/SnackbarItem.tsx | 6 ++++-- src/utils/createTheme.js | 5 +++++ 5 files changed, 21 insertions(+), 8 deletions(-) create mode 100644 src/utils/createTheme.js diff --git a/examples/simple-example/MessageButtons.js b/examples/simple-example/MessageButtons.js index 73717656..1e66f09e 100644 --- a/examples/simple-example/MessageButtons.js +++ b/examples/simple-example/MessageButtons.js @@ -1,6 +1,6 @@ import React, { Component } from 'react'; import clsx from 'clsx'; -import { withStyles } from '@material-ui/core/styles'; +import { withStyles } from '@material-ui/styles'; import Button from '@material-ui/core/Button'; import Paper from '@material-ui/core/Paper'; import { withSnackbar } from 'notistack'; diff --git a/src/SnackbarContainer.tsx b/src/SnackbarContainer.tsx index 37e52cc8..7b940d9b 100644 --- a/src/SnackbarContainer.tsx +++ b/src/SnackbarContainer.tsx @@ -1,8 +1,10 @@ import React from 'react'; import clsx from 'clsx'; -import { makeStyles } from '@material-ui/core/styles'; +import { makeStyles } from '@material-ui/styles'; +import { Theme } from '@material-ui/core/styles'; import { SNACKBAR_INDENTS } from './utils/constants'; import { SnackbarProviderProps } from '.'; +import createTheme from '../utils/createTheme'; const collapse = { container: '& > .MuiCollapse-container', @@ -10,8 +12,9 @@ const collapse = { }; const xsWidthMargin = 16; +const defaultTheme = createTheme(); -const useStyle = makeStyles((theme) => ({ +const useStyle = makeStyles((theme: Theme) => ({ root: { boxSizing: 'border-box', display: 'flex', @@ -74,7 +77,7 @@ const useStyle = makeStyles((theme) => ({ alignItems: 'center', }, }, -})); +}), { defaultTheme }); interface SnackbarContainerProps { diff --git a/src/SnackbarContent/SnackbarContent.tsx b/src/SnackbarContent/SnackbarContent.tsx index 8b7638a9..0f96e03b 100644 --- a/src/SnackbarContent/SnackbarContent.tsx +++ b/src/SnackbarContent/SnackbarContent.tsx @@ -1,7 +1,9 @@ import React, { forwardRef } from 'react'; import clsx from 'clsx'; -import { createStyles, Theme, withStyles, WithStyles } from '@material-ui/core/styles'; +import { withStyles, WithStyles, createStyles } from '@material-ui/styles' +import { Theme } from '@material-ui/core/styles'; import { SnackbarContentProps } from '../index'; +import createTheme from '../utils/createTheme'; const styles = (theme: Theme) => createStyles({ root: { @@ -21,4 +23,5 @@ const SnackbarContent = forwardRef(({ classes, className,
)) -export default withStyles(styles)(SnackbarContent); +const defaultTheme = createTheme(); +export default withStyles(styles, { defaultTheme })(SnackbarContent); diff --git a/src/SnackbarItem/SnackbarItem.tsx b/src/SnackbarItem/SnackbarItem.tsx index e7364a38..b8bd8357 100644 --- a/src/SnackbarItem/SnackbarItem.tsx +++ b/src/SnackbarItem/SnackbarItem.tsx @@ -1,6 +1,7 @@ import React, { useState, useEffect, useRef } from 'react'; import clsx from 'clsx'; -import { withStyles, WithStyles, createStyles, Theme, emphasize } from '@material-ui/core/styles'; +import { withStyles, WithStyles, createStyles } from '@material-ui/styles'; +import { createMuiTheme, Theme, emphasize } from '@material-ui/core/styles'; import Collapse from '@material-ui/core/Collapse'; import SnackbarContent from '../SnackbarContent'; import { getTransitionDirection } from './SnackbarItem.util'; @@ -251,4 +252,5 @@ const SnackbarItem: React.FC = ({ classes, ...props }) => { ); }; -export default withStyles(styles)(SnackbarItem); +const defaultTheme = createMuiTheme(); +export default withStyles(styles, { defaultTheme })(SnackbarItem); diff --git a/src/utils/createTheme.js b/src/utils/createTheme.js new file mode 100644 index 00000000..e606f186 --- /dev/null +++ b/src/utils/createTheme.js @@ -0,0 +1,5 @@ +import * as styles from '@material-ui/core/styles'; + +export default function createTheme(newTheme) { + return styles.createMuiTheme ? styles.createMuiTheme(newTheme) : styles.createTheme(newTheme); +} \ No newline at end of file From bf8e5991dc52f0443c5be68aee5b6bb7a5d54887 Mon Sep 17 00:00:00 2001 From: Marija Najdova Date: Wed, 2 Jun 2021 11:28:15 +0200 Subject: [PATCH 2/5] Update src/SnackbarContainer.tsx --- src/SnackbarContainer.tsx | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/SnackbarContainer.tsx b/src/SnackbarContainer.tsx index 7b940d9b..1fec1725 100644 --- a/src/SnackbarContainer.tsx +++ b/src/SnackbarContainer.tsx @@ -4,7 +4,7 @@ import { makeStyles } from '@material-ui/styles'; import { Theme } from '@material-ui/core/styles'; import { SNACKBAR_INDENTS } from './utils/constants'; import { SnackbarProviderProps } from '.'; -import createTheme from '../utils/createTheme'; +import createTheme from './utils/createTheme'; const collapse = { container: '& > .MuiCollapse-container', From fca3021383a9ebcb33d319b5d5c5d741ebe2d56c Mon Sep 17 00:00:00 2001 From: Marija Najdova Date: Wed, 2 Jun 2021 11:32:29 +0200 Subject: [PATCH 3/5] Update src/SnackbarItem/SnackbarItem.tsx --- src/SnackbarItem/SnackbarItem.tsx | 3 ++- 1 file changed, 2 insertions(+), 1 deletion(-) diff --git a/src/SnackbarItem/SnackbarItem.tsx b/src/SnackbarItem/SnackbarItem.tsx index b8bd8357..1a5ed14e 100644 --- a/src/SnackbarItem/SnackbarItem.tsx +++ b/src/SnackbarItem/SnackbarItem.tsx @@ -1,7 +1,8 @@ import React, { useState, useEffect, useRef } from 'react'; import clsx from 'clsx'; import { withStyles, WithStyles, createStyles } from '@material-ui/styles'; -import { createMuiTheme, Theme, emphasize } from '@material-ui/core/styles'; +import { Theme, emphasize } from '@material-ui/core/styles'; +import createTheme from '../utils/createTheme'; import Collapse from '@material-ui/core/Collapse'; import SnackbarContent from '../SnackbarContent'; import { getTransitionDirection } from './SnackbarItem.util'; From 7996776170aab9c90d4312e3252d0c10bb998068 Mon Sep 17 00:00:00 2001 From: Marija Najdova Date: Wed, 2 Jun 2021 11:32:45 +0200 Subject: [PATCH 4/5] Update src/SnackbarItem/SnackbarItem.tsx --- src/SnackbarItem/SnackbarItem.tsx | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/SnackbarItem/SnackbarItem.tsx b/src/SnackbarItem/SnackbarItem.tsx index 1a5ed14e..d3395cfe 100644 --- a/src/SnackbarItem/SnackbarItem.tsx +++ b/src/SnackbarItem/SnackbarItem.tsx @@ -253,5 +253,5 @@ const SnackbarItem: React.FC = ({ classes, ...props }) => { ); }; -const defaultTheme = createMuiTheme(); +const defaultTheme = createTheme(); export default withStyles(styles, { defaultTheme })(SnackbarItem); From 82a1975b255b8be6b43b3d61c03bac36366eae47 Mon Sep 17 00:00:00 2001 From: Marija Najdova Date: Fri, 4 Jun 2021 16:53:03 +0200 Subject: [PATCH 5/5] use createMuiTheme --- src/SnackbarContainer.tsx | 3 +-- src/SnackbarContent/SnackbarContent.tsx | 3 +-- src/SnackbarItem/SnackbarItem.tsx | 3 +-- src/utils/createTheme.js | 5 ----- 4 files changed, 3 insertions(+), 11 deletions(-) delete mode 100644 src/utils/createTheme.js diff --git a/src/SnackbarContainer.tsx b/src/SnackbarContainer.tsx index 1fec1725..65b66723 100644 --- a/src/SnackbarContainer.tsx +++ b/src/SnackbarContainer.tsx @@ -1,10 +1,9 @@ import React from 'react'; import clsx from 'clsx'; import { makeStyles } from '@material-ui/styles'; -import { Theme } from '@material-ui/core/styles'; +import { Theme, createMuiTheme as createTheme } from '@material-ui/core/styles'; import { SNACKBAR_INDENTS } from './utils/constants'; import { SnackbarProviderProps } from '.'; -import createTheme from './utils/createTheme'; const collapse = { container: '& > .MuiCollapse-container', diff --git a/src/SnackbarContent/SnackbarContent.tsx b/src/SnackbarContent/SnackbarContent.tsx index 0f96e03b..c33355ed 100644 --- a/src/SnackbarContent/SnackbarContent.tsx +++ b/src/SnackbarContent/SnackbarContent.tsx @@ -1,9 +1,8 @@ import React, { forwardRef } from 'react'; import clsx from 'clsx'; import { withStyles, WithStyles, createStyles } from '@material-ui/styles' -import { Theme } from '@material-ui/core/styles'; +import { Theme, createMuiTheme as createTheme } from '@material-ui/core/styles'; import { SnackbarContentProps } from '../index'; -import createTheme from '../utils/createTheme'; const styles = (theme: Theme) => createStyles({ root: { diff --git a/src/SnackbarItem/SnackbarItem.tsx b/src/SnackbarItem/SnackbarItem.tsx index d3395cfe..addedff5 100644 --- a/src/SnackbarItem/SnackbarItem.tsx +++ b/src/SnackbarItem/SnackbarItem.tsx @@ -1,8 +1,7 @@ import React, { useState, useEffect, useRef } from 'react'; import clsx from 'clsx'; import { withStyles, WithStyles, createStyles } from '@material-ui/styles'; -import { Theme, emphasize } from '@material-ui/core/styles'; -import createTheme from '../utils/createTheme'; +import { Theme, emphasize, createMuiTheme as createTheme } from '@material-ui/core/styles'; import Collapse from '@material-ui/core/Collapse'; import SnackbarContent from '../SnackbarContent'; import { getTransitionDirection } from './SnackbarItem.util'; diff --git a/src/utils/createTheme.js b/src/utils/createTheme.js deleted file mode 100644 index e606f186..00000000 --- a/src/utils/createTheme.js +++ /dev/null @@ -1,5 +0,0 @@ -import * as styles from '@material-ui/core/styles'; - -export default function createTheme(newTheme) { - return styles.createMuiTheme ? styles.createMuiTheme(newTheme) : styles.createTheme(newTheme); -} \ No newline at end of file