import { Grommet } from 'grommet';
import merge from 'lodash/merge';
import * as React from 'react';
import styled from 'styled-components';
import { DefaultProps, Theme } from '../../common-types';
import defaultTheme from '../../theme';
import { px } from '../../utils';
import { BreakpointProvider } from './BreakpointProvider';

const Base = styled(Grommet)`
	font-family: ${props => props.theme.font};
	font-size: ${props => px(props.theme.fontSizes[1])};

	h1,
	h2,
	h3,
	h4,
	h5,
	h6,
	button {
		font-family: ${props => props.theme.titleFont};
	}
`;

const Provider = ({ theme, ...props }: ThemedProvider) => {
	const providerTheme = merge(defaultTheme, theme);
	return (
		<BreakpointProvider breakpoints={providerTheme.breakpoints}>
			<Base theme={providerTheme} {...props} />
		</BreakpointProvider>
	);
};

export interface ThemedProvider extends DefaultProps {
	theme?: Theme;
}

export default Provider;

import { Grommet } from 'grommet';
import merge from 'lodash/merge';
import * as React from 'react';
import styled from 'styled-components';
import { DefaultProps, Theme } from '../../common-types';
import defaultTheme from '../../theme';
import { px } from '../../utils';
import { BreakpointProvider } from './BreakpointProvider';

const Base = styled(Grommet)`
	font-family: ${props => props.theme.font};
	font-size: ${props => px(props.theme.fontSizes[1])};

	h1,
	h2,
	h3,
	h4,
	h5,
	h6,
	button {
		font-family: ${props => props.theme.titleFont};
	}
`;

const Provider = ({ theme, ...props }: ThemedProvider) => {
	const providerTheme = merge(defaultTheme, theme);
	return (
		<BreakpointProvider breakpoints={providerTheme.breakpoints}>
			<Base theme={providerTheme} {...props} />
		</BreakpointProvider>
	);
};

export interface ThemedProvider extends DefaultProps {
	theme?: Partial<Theme>;
}

export default Provider;

Fix the theme prop typings
Provider: Fix the theme prop typings

Since we do `merge`, we do not require
all theme props to be provided.

Change-type: patch
Signed-off-by: Thodoris Greasidis <5791bdc4541e79bd43d586e3c3eff1e39c16665f@balena.io>
