fix: Declare custom color hues

47ng · Apr 15, 2020 · 0f38782 · 0f38782
1 parent e12a489
commit 0f38782
Show file tree

Hide file tree

Showing 2 changed files with 11 additions and 5 deletions.
diff --git a/src/pages/_app.tsx b/src/pages/_app.tsx
@@ -2,9 +2,8 @@ import React from 'react'
 import App from 'next/app'
 import ThemeProvider from '@chakra-ui/core/dist/ThemeProvider'
 import CSSReset, { CSSResetProps } from '@chakra-ui/core/dist/CSSReset'
-import type { ITheme } from '@chakra-ui/core/dist/theme'
 import { Global, css, SerializedStyles } from '@emotion/core'
-import { defaultTheme } from '../ui/theme'
+import { defaultTheme, Theme } from '../ui/theme'
 
 type GetGlobalConfig = Required<CSSResetProps>['config']
 
@@ -32,7 +31,7 @@ const defaultGlobalCss = css`
 // --
 
 export interface AppTraits {
-  theme?: ITheme
+  theme?: Theme
   getGlobalConfig?: CSSResetProps['config']
   globalCss?: SerializedStyles
   Providers?: React.FunctionComponent<any>

diff --git a/src/ui/theme.ts b/src/ui/theme.ts
@@ -1,8 +1,15 @@
-import chakraTheme, { ITheme } from '@chakra-ui/core/dist/theme'
+import chakraTheme, { ITheme, ColorHues } from '@chakra-ui/core/dist/theme'
 import { tailwindColors } from './colors'
 import { systemFontStack, systemMonoFontStack } from './fonts'
 
-export const defaultTheme: ITheme = {
+export interface Theme extends ITheme {
+  colors: ITheme['colors'] & {
+    // Custom colors hues
+    indigo: ColorHues
+  }
+}
+
+export const defaultTheme: Theme = {
   ...chakraTheme,
   fonts: {
     ...chakraTheme.fonts,