import React from "react" ; import { connect } from "react-redux" ; import { ThemeProvider as ExternalProvider , ThemeCode , Theme , } from "onefx/lib/styletron-react" ; import { actionSetTheme as setTheme } from "../base-reducer" ; import { colors } from "./style-color" ; export const THEME = { colors , sizing : [ "2px" , "6px" , "10px" , "16px" , "24px" , "32px" ] , fonts : [ ] } ; const THEME_DARK = THEME ; export const ThemeProvider = connect ( ( state ) => ( { themeCode : state . base . themeCode , } ) , ( dispatch ) => ( { actionSetTheme : ( t ) => { return dispatch ( setTheme ( t ) ) ; } , } ) ) ( ( { children , themeCode , actionSetTheme , } ) : JSX . Element => { return ( < ExternalProvider light = { THEME } dark = { THEME_DARK } setTheme = { actionSetTheme } themeCode = { themeCode } > { children } < /ExternalProvider>); } ) ;