All files / config withTheme.js

90.48% Statements 19/21
58.82% Branches 10/17
100% Functions 5/5
90.48% Lines 19/21

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 56 57 58 59 60 61 62 63 64 65 66 67        23x 99x   23x       46x   46x       46x                   46x 46x           46x 9x   37x             53x           53x 9x     53x 53x     53x 12x     41x        
import React from 'react';
import { merge, ThemeConsumer } from './index';
import DefaultTheme from './theme';
 
const isClassComponent = Component =>
  Boolean(Component.prototype && Component.prototype.isReactComponent);
 
const withTheme = (WrappedComponent, themeKey) => {
  class ThemedComponent extends React.Component {
    render() {
      /* eslint-disable react/prop-types */
      const { forwardedRef, ...rest } = this.props;
 
      return (
        <ThemeConsumer>
          {context => {
            // If user isn't using ThemeProvider
            Iif (!context) {
              let props = { ...rest, theme: DefaultTheme };
 
              return isClassComponent(WrappedComponent) ? (
                <WrappedComponent ref={forwardedRef} {...props} />
              ) : (
                <WrappedComponent {...props} />
              );
            }
 
            const { theme, updateTheme } = context;
            const props = {
              theme,
              updateTheme,
              ...merge({}, themeKey && theme[themeKey], rest),
            };
 
            if (isClassComponent(WrappedComponent)) {
              return <WrappedComponent ref={forwardedRef} {...props} />;
            }
            return <WrappedComponent {...props} />;
          }}
        </ThemeConsumer>
      );
    }
  }
 
  const name = themeKey
    ? `Themed.${themeKey}`
    : `Themed.${WrappedComponent.displayName ||
        WrappedComponent.name ||
        'Component'}`;
 
  const forwardRef = (props, ref) => {
    return <ThemedComponent {...props} forwardedRef={ref} />;
  };
 
  ThemedComponent.displayName = name;
  forwardRef.displayName = name;
 
  // Forward refs from children
  if (isClassComponent(WrappedComponent)) {
    return React.forwardRef(forwardRef);
  }
 
  return ThemedComponent;
};
 
export default withTheme;