import React, { PureComponent } from 'react' import PropTypes from 'prop-types' import Helmet from 'react-helmet' import posed from 'react-pose' import { Consumer } from '../../store/createContext' import { fadeIn } from '../atoms/Transitions' import { ReactComponent as Day } from '../../images/day.svg' import { ReactComponent as Night } from '../../images/night.svg' import styles from './ThemeSwitch.module.scss' const Animation = posed.aside(fadeIn) const ThemeToggle = ({ dark }) => ( ) ThemeToggle.propTypes = { dark: PropTypes.bool.isRequired } const ThemeToggleInput = ({ dark, toggleDark }) => ( toggleDark()} type="checkbox" name="toggle" value="toggle" aria-describedby="toggle" checked={dark} /> ) ThemeToggleInput.propTypes = { dark: PropTypes.bool.isRequired, toggleDark: PropTypes.func.isRequired } export default class ThemeSwitch extends PureComponent { render() { return ( {({ dark, toggleDark }) => ( <> )} ) } }