From fca02043f98b36113dda3acc80e6fe79fd053933 Mon Sep 17 00:00:00 2001
From: Ed Sungik Choi <sungik.dev@gmail.com>
Date: Thu, 30 Nov 2023 15:03:52 +0900
Subject: [PATCH] feat(theme-provider): apply the changed design token
 structure

---
 .../src/providers/ThemeProvider.tsx            | 18 +++++++++++-------
 1 file changed, 11 insertions(+), 7 deletions(-)

diff --git a/packages/bezier-react/src/providers/ThemeProvider.tsx b/packages/bezier-react/src/providers/ThemeProvider.tsx
index fd302d93cf..2195423373 100644
--- a/packages/bezier-react/src/providers/ThemeProvider.tsx
+++ b/packages/bezier-react/src/providers/ThemeProvider.tsx
@@ -11,26 +11,30 @@ import { createContext } from '~/src/utils/react'
 type Tokens = typeof tokens
 type GlobalTokens = Tokens['global']
 type SemanticTokens = Omit<Tokens, 'global'>
-type FlattedTokens = GlobalTokens & SemanticTokens[keyof SemanticTokens]
+
+type ThemedTokenSet = {
+  global: GlobalTokens
+  semantic: SemanticTokens[keyof SemanticTokens]
+}
 
 // TODO: Change theme name constant to import from bezier-tokens
 export type ThemeName = 'light' | 'dark'
 
 interface TokenContextValue {
   themeName: ThemeName
-  tokens: FlattedTokens
+  tokens: ThemedTokenSet
 }
 
 const [TokenContextProvider, useTokenContext] = createContext<TokenContextValue | null>(null, 'TokenProvider')
 
-const tokenSet: Record<ThemeName, FlattedTokens> = Object.freeze({
+const tokenSet: Record<ThemeName, ThemedTokenSet> = Object.freeze({
   light: {
-    ...tokens.global,
-    ...tokens.lightTheme,
+    global: tokens.global,
+    semantic: tokens.lightTheme,
   },
   dark: {
-    ...tokens.global,
-    ...tokens.darkTheme,
+    global: tokens.global,
+    semantic: tokens.darkTheme,
   },
 })