import React from 'react';
import PropTypes from 'prop-types';
import { ThemeProvider } from 'styled-components';
import * as presets from './Presets';
import GlobalStyle from './GlobalStyle';

/**
 * @param children react element
 * @param theme ThemeUIStylesObject from preset list
 * @param defaultStyles boolean to add or not default tag style
 * @returns {JSX.Element}
 * @constructor
 */
const Provider = ({ children, theme, defaultStyles = false }) => (
  <ThemeProvider theme={theme}>
    {defaultStyles ? <GlobalStyle /> : null}
    {children}
  </ThemeProvider>
);

Provider.propTypes = {
  theme: PropTypes.object,
  children: PropTypes.element,
  defaultStyles: PropTypes.bool
};

export default {
  Provider
};

export { Provider, presets };