Prevent snackbars from having the same width (#356)

iamhosseindhv · Feb 28, 2021 · 24fff56 · 24fff56
1 parent 700bacb
commit 24fff56
Show file tree

Hide file tree

Showing 2 changed files with 5 additions and 1 deletion.
diff --git a/src/SnackbarItem/SnackbarItem.tsx b/src/SnackbarItem/SnackbarItem.tsx
@@ -80,6 +80,9 @@ const styles = (theme: Theme) => {
             marginTop: SNACKBAR_INDENTS.snackbar.dense,
             marginBottom: SNACKBAR_INDENTS.snackbar.dense,
         },
+        collapseWrapperInner: {
+            width: 'auto',
+        },
     });
 }
 

diff --git a/src/SnackbarItem/SnackbarItem.util.ts b/src/SnackbarItem/SnackbarItem.util.ts
@@ -21,7 +21,8 @@ export const getTransitionDirection = (anchorOrigin: Snack['anchorOrigin']): Dir
 /**
  * Omit all class keys except what we need for collapse component
  */
-export const omitNonCollapseKeys = (classes: SnackbarItemProps['classes'], dense: SnackbarProviderProps['dense']): { container: string; wrapper: string } => ({
+export const omitNonCollapseKeys = (classes: SnackbarItemProps['classes'], dense: SnackbarProviderProps['dense']): { container: string; wrapper: string; wrapperInner: string; } => ({
     container: classes.collapseContainer,
     wrapper: clsx(classes.collapseWrapper, { [classes.collapseWrapperDense]: dense }),
+    wrapperInner: classes.collapseWrapperInner,
 });