All files / config ThemeProvider.js

100% Statements 10/10
100% Branches 0/0
100% Functions 5/5
100% Lines 9/9

Press n or j to go to the next uncovered block, b, p or k for the previous block.

1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55            27x       25x   25x                     1x         1x     26x                         27x         27x       27x  
import React from 'react';
import PropTypes from 'prop-types';
import merge from 'lodash.merge';
 
import colors from './colors';
 
const ThemeContext = React.createContext();
 
export default class ThemeProvider extends React.Component {
  constructor(props) {
    super(props);
 
    this.state = {
      theme: merge(
        {
          colors,
        },
        props.theme
      ),
    };
  }
 
  updateTheme = updates => {
    this.setState(({ theme }) => ({
      theme: merge({}, theme, updates),
    }));
  };
 
  getTheme = () => this.state.theme;
 
  render() {
    return (
      <ThemeContext.Provider
        value={{
          theme: this.state.theme,
          updateTheme: this.updateTheme,
        }}
      >
        {this.props.children}
      </ThemeContext.Provider>
    );
  }
}
 
ThemeProvider.propTypes = {
  theme: PropTypes.object,
  children: PropTypes.node.isRequired,
};
 
ThemeProvider.defaultProps = {
  theme: {},
};
 
export const ThemeConsumer = ThemeContext.Consumer;