Pull out platform specific styles

src/components/Toast/index.tsx

@@ -20,11 +20,19 @@ import {useSafeAreaInsets} from 'react-native-safe-area-context'
 
 import {useNonReactiveCallback} from '#/lib/hooks/useNonReactiveCallback'
 import {atoms as a} from '#/alf'
-import {TOAST_ANIMATION_CONFIG} from '#/components/Toast/style'
 import {Toast as BaseToast} from '#/components/Toast/Toast'
 import {type ToastType} from '#/components/Toast/types'
 
 const TIMEOUT = 2e3
+const TOAST_ANIMATION_CONFIG = {
+  duration: 300,
+  damping: 15,
+  stiffness: 150,
+  mass: 0.8,
+  overshootClamping: false,
+  restSpeedThreshold: 0.01,
+  restDisplacementThreshold: 0.01,
+}
 
 export function ToastContainer() {
   return null

src/components/Toast/index.web.tsx

@@ -8,11 +8,18 @@ import {msg} from '@lingui/macro'
 import {useLingui} from '@lingui/react'
 
 import {atoms as a, web} from '#/alf'
-import {getToastWebAnimationStyles} from '#/components/Toast/style'
 import {Toast} from '#/components/Toast/Toast'
 import {type ToastType} from '#/components/Toast/types'
 
 const DURATION = 3500
+const TOAST_ANIMATION_STYLES = {
+  entering: {
+    animation: 'toastFadeIn 0.3s ease-out forwards',
+  },
+  exiting: {
+    animation: 'toastFadeOut 0.2s ease-in forwards',
+  },
+}
 
 interface ActiveToast {
   text: string
@@ -43,8 +50,6 @@ export const ToastContainer: React.FC<ToastContainerProps> = ({}) => {
     }
   }, [activeToast])
 
-  const animationStyles = getToastWebAnimationStyles()
-
   return (
     <>
       {activeToast && (
@@ -57,8 +62,8 @@ export const ToastContainer: React.FC<ToastContainerProps> = ({}) => {
               width: web(`calc(100% - ${a.px_xl.paddingLeft * 2})`),
               maxWidth: 380,
               ...(isExiting
-                ? animationStyles.exiting
+                ? TOAST_ANIMATION_STYLES.exiting
-                : animationStyles.entering),
+                : TOAST_ANIMATION_STYLES.entering),
             },
           ]}>
           <Toast content={activeToast.text} type={activeToast.type} />

src/components/Toast/style.ts

@@ -4,16 +4,6 @@ import {CircleInfo_Stroke2_Corner0_Rounded as CircleInfo} from '#/components/ico
 import {CircleInfo_Stroke2_Corner0_Rounded as ErrorIcon} from '#/components/icons/CircleInfo'
 import {Warning_Stroke2_Corner0_Rounded as WarningIcon} from '#/components/icons/Warning'
 
-export const TOAST_ANIMATION_CONFIG = {
-  duration: 300,
-  damping: 15,
-  stiffness: 150,
-  mass: 0.8,
-  overshootClamping: false,
-  restSpeedThreshold: 0.01,
-  restDisplacementThreshold: 0.01,
-}
-
 export const TOAST_TYPE_TO_ICON = {
   default: SuccessIcon,
   success: SuccessIcon,
@@ -134,12 +124,3 @@ export const getToastTypeStyles = (t: Theme) => ({
     }),
   },
 })
-
-export const getToastWebAnimationStyles = () => ({
-  entering: {
-    animation: 'toastFadeIn 0.3s ease-out forwards',
-  },
-  exiting: {
-    animation: 'toastFadeOut 0.2s ease-in forwards',
-  },
-})