diff --git a/src/components/Toast.tsx b/src/components/Toast.tsx
index 8db6291..5cc36e2 100644
--- a/src/components/Toast.tsx
+++ b/src/components/Toast.tsx
@@ -74,20 +74,7 @@ export const Toast: FC<Props> = ({
 }) => {
   const insets = useSafeAreaInsets();
   const { width, height } = useWindowDimensions();
-
-  useVisibilityChange(
-    () => {
-      onToastShow?.(toast);
-    },
-    () => {
-      onToastHide?.(toast);
-    },
-    toast.visible
-  );
-
   const isSystemDarkMode = useColorScheme() === 'dark';
-  const isDarkMode =
-    overrideDarkMode !== undefined ? overrideDarkMode : isSystemDarkMode;
 
   const [toastHeight, setToastHeight] = useState<number>(
     toast?.height ? toast.height : DEFAULT_TOAST_HEIGHT
@@ -96,6 +83,9 @@ export const Toast: FC<Props> = ({
     toast?.width ? toast.width : width - 32 > 360 ? 360 : width - 32
   );
 
+  const isDarkMode =
+    overrideDarkMode !== undefined ? overrideDarkMode : isSystemDarkMode;
+
   const startingY = useMemo(
     () =>
       toast.position === ToastPosition.TOP
@@ -109,6 +99,7 @@ export const Toast: FC<Props> = ({
   const offsetY = useSharedValue(startingY);
 
   const onPress = () => onToastPress?.(toast);
+
   const dismiss = useCallback((id: string) => {
     toasting.dismiss(id);
   }, []);
@@ -213,6 +204,16 @@ export const Toast: FC<Props> = ({
     toast.animationConfig,
   ]);
 
+  useVisibilityChange(
+    () => {
+      onToastShow?.(toast);
+    },
+    () => {
+      onToastHide?.(toast);
+    },
+    toast.visible
+  );
+
   useEffect(() => {
     setToastHeight(toast?.height ? toast.height : DEFAULT_TOAST_HEIGHT);
   }, [toast.height]);
diff --git a/src/components/Toasts.tsx b/src/components/Toasts.tsx
index 09e1bda..44a68cf 100644
--- a/src/components/Toasts.tsx
+++ b/src/components/Toasts.tsx
@@ -60,8 +60,8 @@ export const Toasts: FunctionComponent<Props> = ({
         left: insets.left + (extraInsets?.left ?? 0),
         right: insets.right + (extraInsets?.right ?? 0),
         bottom: insets.bottom + (extraInsets?.bottom ?? 0) + 16,
+        pointerEvents: 'box-none',
       }}
-      pointerEvents={'box-none'}
     >
       {toasts.map((t) => (
         <Toast
diff --git a/src/index.tsx b/src/index.tsx
index e48b3cf..886e3dc 100644
--- a/src/index.tsx
+++ b/src/index.tsx
@@ -1,4 +1,4 @@
 export { useToaster } from './core/use-toaster';
 export { Toasts } from './components';
 export * from './headless';
-export { ToastPosition, ToastAnimationType } from './core/types';
+export { ToastPosition, type ToastAnimationType } from './core/types';