Use deepmerge themes when overriding

[alexislightspeed]

Description

Provide a high-level summary of your issue.

flame/packages/flame/src/Core/index.tsx

Line 106 in de4b4c8

return <ThemeProvider theme={{ ...selectedTheme, ...themeOverrides }}>{children}</ThemeProvider>;

Rather than spreading both objects together, use deepmerge so that a new theme may extend the ThemeUI without fully overriding the original theme.

What do you think should have happened?

The color would be deepmerged. Instead the color is overwritten by the ThemeOverride

Steps to reproduce the problem

const existingTheme = {col:{blue:'blue'}};
const newTheme = {col:{red:'red'}};
const mergedTheme = {...existingTheme, ...newTheme};
console.log(mergedTheme);
:rip:

Specifications

• Affected component(s): Core / FlameTheme

[glambert]

@xdrdak are we restricting this for a reason? Should we instead document how to override on the consumer-side and at that point recommend using deepmerge for example?