33 lines
782 B
JavaScript
33 lines
782 B
JavaScript
import React, { Component } from 'react';
|
|
import { ThemeProvider } from 'styled-components';
|
|
import { ValueBreakpoints } from 'joyent-ui-toolkit';
|
|
import debounce from 'lodash.debounce';
|
|
|
|
export default class extends Component {
|
|
state = {
|
|
screen: 'desktop'
|
|
};
|
|
|
|
setScreen = () => {
|
|
const screen =
|
|
window.innerWidth <= ValueBreakpoints.small.upper ? 'mobile' : 'desktop';
|
|
this.setState({ screen });
|
|
};
|
|
|
|
componentWillMount() {
|
|
window.addEventListener('resize', debounce(this.setScreen, 100));
|
|
this.setScreen();
|
|
}
|
|
|
|
render() {
|
|
const { theme, children, ...props } = this.props;
|
|
const { screen } = this.state;
|
|
|
|
return (
|
|
<ThemeProvider theme={{ ...theme, screen }} {...props}>
|
|
{children}
|
|
</ThemeProvider>
|
|
);
|
|
}
|
|
}
|