From 34904f56403ba39bef0857c041928f255f882260 Mon Sep 17 00:00:00 2001
From: Gunnar Torfi <gunnartorfis@gmail.com>
Date: Tue, 10 Sep 2024 08:58:13 +0000
Subject: [PATCH] fix: theme was not used when passed to Toaster

---
 example/src/App.tsx | 1 +
 src/constants.ts    | 9 ++++++++-
 src/toaster.tsx     | 3 +++
 src/types.ts        | 1 +
 src/use-colors.ts   | 5 +++--
 5 files changed, 16 insertions(+), 3 deletions(-)

diff --git a/example/src/App.tsx b/example/src/App.tsx
index a1f99e7..37dccb7 100644
--- a/example/src/App.tsx
+++ b/example/src/App.tsx
@@ -18,6 +18,7 @@ const App: React.FC = () => {
           swipToDismissDirection="up"
           visibleToasts={4}
           closeButton
+          theme="system"
           icons={{
             error: <Text>💥</Text>,
             loading: <Text>🔄</Text>,
diff --git a/src/constants.ts b/src/constants.ts
index 0a16747..28a1a03 100644
--- a/src/constants.ts
+++ b/src/constants.ts
@@ -1,4 +1,9 @@
-import type { ToastPosition, ToastSwipeDirection, ToastVariant } from './types';
+import type {
+  ToastPosition,
+  ToastSwipeDirection,
+  ToastTheme,
+  ToastVariant,
+} from './types';
 
 export const toastDefaultValues: {
   duration: number;
@@ -14,6 +19,7 @@ export const toastDefaultValues: {
   pauseWhenPageIsHidden: boolean;
   cn: (...classes: Array<string | undefined>) => string;
   gap: number;
+  theme: ToastTheme;
 } = {
   duration: 4000,
   position: 'top-center',
@@ -28,4 +34,5 @@ export const toastDefaultValues: {
   pauseWhenPageIsHidden: false,
   cn: (...classes) => classes.filter(Boolean).join(' '),
   gap: 14,
+  theme: 'system',
 };
diff --git a/src/toaster.tsx b/src/toaster.tsx
index 6b61873..d64cb4b 100644
--- a/src/toaster.tsx
+++ b/src/toaster.tsx
@@ -44,6 +44,7 @@ export const ToasterUI: React.FC<ToasterProps> = ({
   pauseWhenPageIsHidden,
   cn,
   gap,
+  theme,
   ...props
 }) => {
   const [toasts, setToasts] = React.useState<ToastProps[]>([]);
@@ -163,6 +164,7 @@ export const ToasterUI: React.FC<ToasterProps> = ({
         pauseWhenPageIsHidden ?? toastDefaultValues.pauseWhenPageIsHidden,
       cn: cn ?? toastDefaultValues.cn,
       gap: gap ?? toastDefaultValues.gap,
+      theme: theme ?? toastDefaultValues.theme,
     }),
     [
       duration,
@@ -177,6 +179,7 @@ export const ToasterUI: React.FC<ToasterProps> = ({
       pauseWhenPageIsHidden,
       cn,
       gap,
+      theme,
     ]
   );
 
diff --git a/src/types.ts b/src/types.ts
index 82be4d0..a405c51 100644
--- a/src/types.ts
+++ b/src/types.ts
@@ -135,6 +135,7 @@ export type ToasterContextType = Required<
     | 'pauseWhenPageIsHidden'
     | 'cn'
     | 'gap'
+    | 'theme'
   >
 > & {
   addToast: AddToastContextHandler;
diff --git a/src/use-colors.ts b/src/use-colors.ts
index 4182818..f832a35 100644
--- a/src/use-colors.ts
+++ b/src/use-colors.ts
@@ -28,8 +28,9 @@ const dark: typeof light = {
 };
 
 export const useColors = (ivertProps?: boolean) => {
-  const { invert: invertCtx } = useToastContext();
-  const scheme = useColorScheme();
+  const { invert: invertCtx, theme } = useToastContext();
+  const systemScheme = useColorScheme();
+  const scheme = theme === 'system' ? systemScheme : theme;
   const invert = ivertProps ?? invertCtx;
 
   if (scheme === 'dark') {