Nested overrides playground

[tajo]

This PR adds support for nested overrides into our interactive playground and makes the whole UI more condensed:

Features

• It works recursively, so it should work even for most complex cases.
• Accordion now uses the stateless version that's always in sync with the code snippet. For example if you delete an override, it will close the related tree branch in the playground. This was buggy before because we had only stateful accordion.
• There is a nested tooltip you can hover over and get more info.
• It is very easy to configure this for each component (this PR updates only Select -> Tag to demo it).

overrides: {
  custom: {
    names: [
      'Root',
      TagConfig,

Before, the names could be only strings. Now, it can be also a component configuration to represent the nested override.

• Default style object for override now omits return {} to limit code nesting (as you can see in the screenshot). There was actually a bug in @babel/generator that did not correctly parenthesized returning object of the arrow function () => ({}) and resulted in syntax error. Fortunately, it was recently fixed so that's the only reason why react-view needed to be bumped.

[vercel]

This pull request is being automatically deployed with Vercel (learn more).
To see the status of your deployment, click below or on the icon next to each commit.

🔍 Inspect: https://vercel.com/uber-ui-platform/baseweb/lvaumb46b
✅ Preview: https://baseweb-git-nested-overrides.uber-ui-platform.vercel.app

[codesandbox-ci]

This pull request is automatically built and testable in CodeSandbox.

To see build info of the built libraries, click here or the icon next to each commit SHA.

Latest deployment of this branch, based on commit 6c149a0:

Sandbox	Source
Basic usage	Configuration

[chasestarr]

Works well for this particular nested override. Feel free to ignore the comment I made until a later pr

[chasestarr]

There are some nested overrides that don't have the same key as the component name. For example there are multiple 'Select' components in the datepicker. May need to add some key value pair in the config file

https://github.com/uber/baseweb/blob/master/src/datepicker/types.js#L29

[tajo]

for that case it should be enough to do

overrides: {
  custom: {
    names: [
      'Root',
      {...TagConfig, componentName: 'TagRenamed' }

if not, will come up with some different fix later

[gergelyke]

this is really cool 👏