feat: custom shadow in ToastConfig (#85)

feat: allow custom shadow in ToastConfig chore: add shadow to readme
jeanverster · Feb 2, 2022 · 031a6eb · 031a6eb
1 parent f2a37db
commit 031a6eb
Show file tree

Hide file tree

Showing 2 changed files with 14 additions and 2 deletions.
diff --git a/README.md b/README.md
@@ -207,5 +207,6 @@ Because of the theming capability of `react-native-styled-toast`, it has out of
 | **`messageProps`**      | TextProps | no       | Allows custom styling message                                                                  | {}             |
 | **`subMessageProps`**   | TextProps | no       | Allows custom styling subMessage                                                               | {}             |
 | **`allowFontScaling`**  | boolean   | no       | Allows font scaling                                                                            | true          |
+| **`shadow`**  | ShadowProps   | no       | Allows custom shadow                                           | {}       |
 <br />
 <div>Toast icon by <a href="https://www.flaticon.com/authors/ultimatearm" title="ultimatearm">ultimatearm</a> from <a href="https://www.flaticon.com/"             title="Flaticon">www.flaticon.com</a></div>
diff --git a/src/Toast/index.tsx b/src/Toast/index.tsx
@@ -46,6 +46,16 @@ export type ToastConfig = {
   hideCloseIcon?: boolean
   iconSize?: number
   allowFontScaling?: boolean
+  shadow?: {
+    shadowColor?: string
+    shadowOffset?: {
+      width: number
+      height: number
+    }
+    shadowOpacity?: number
+    shadowRadius?: number
+    elevation?: number
+  }
 }
 
 const statusBarHeight = getStatusBarHeight()
@@ -59,7 +69,7 @@ export type ToastInternalConfig = {
 
 const offset = statusBarHeight + 16
 
-const shadow = {
+const shadowDefault = {
   shadowColor: '#000',
   shadowOffset: {
     width: 0,
@@ -125,7 +135,8 @@ export const Toast: React.FC<ToastConfig & ToastInternalConfig> = ({
   closeButtonStyles,
   hideCloseIcon,
   iconSize,
-  allowFontScaling
+  allowFontScaling,
+  shadow = shadowDefault
 }) => {
   const isSuccess = intent === 'SUCCESS'
   const isInfo = intent === 'INFO'