diff --git a/.travis.yml b/.travis.yml
index f5461c7..1d17278 100644
--- a/.travis.yml
+++ b/.travis.yml
@@ -1,13 +1,12 @@
 language: node_js
 node_js:
-  - "8"
+  - "10"
+  - "12"
 cache:
   yarn: true
   directories:
     - "node_modules"
 before_install:
-  - curl -o- -L https://yarnpkg.com/install.sh | bash -s -- --version 1.3.2
-  - export PATH="$HOME/.yarn/bin:$PATH"
   - export TZ=Europe/Berlin
 before_script:
   - yarn add react react-dom prop-types
diff --git a/__tests__/config.js b/__tests__/config.js
deleted file mode 100644
index e320d20..0000000
--- a/__tests__/config.js
+++ /dev/null
@@ -1,6 +0,0 @@
-import Enzyme from 'enzyme'
-import Adapter from 'enzyme-adapter-react-16'
-import { createSerializer } from 'enzyme-to-json'
-
-Enzyme.configure({ adapter: new Adapter() })
-expect.addSnapshotSerializer(createSerializer({ mode: 'deep' }))
diff --git a/package.json b/package.json
index 00ebf1d..611bc61 100644
--- a/package.json
+++ b/package.json
@@ -63,6 +63,7 @@
     "eslint-plugin-jsx-a11y": "^6.2.1",
     "eslint-plugin-react": "^7.13.0",
     "express": "^4.17.1",
+    "jest-enzyme": "^7.0.2",
     "react-mock-router": "^1.0.15",
     "react-scripts": "^3.0.1",
     "tslint": "^5.17.0",
@@ -78,6 +79,14 @@
     "dashboard",
     "material-ui"
   ],
+  "jest": {
+    "watchPathIgnorePatterns": [
+      "node_modules",
+      "build",
+      "coverage",
+      "dist"
+    ]
+  },
   "browserslist": {
     "production": [
       ">0.2%",
diff --git a/src/AddButton/AddButton.test.jsx b/src/AddButton/AddButton.test.jsx
index f3c7f7f..0572cc0 100644
--- a/src/AddButton/AddButton.test.jsx
+++ b/src/AddButton/AddButton.test.jsx
@@ -1,10 +1,10 @@
 import React from 'react'
-import { mount } from 'enzyme'
+import { shallow } from 'enzyme'
 
-import AddButton from './'
+import AddButton from '.'
 
 it('renders correctly', () => {
-  const tree = mount(<AddButton onClick={() => {}} />)
+  const tree = shallow(<AddButton onClick={() => {}} />)
 
   expect(tree).toMatchSnapshot()
 })
diff --git a/src/AddButton/__snapshots__/AddButton.test.jsx.snap b/src/AddButton/__snapshots__/AddButton.test.jsx.snap
index 8735578..df1b1c1 100644
--- a/src/AddButton/__snapshots__/AddButton.test.jsx.snap
+++ b/src/AddButton/__snapshots__/AddButton.test.jsx.snap
@@ -1,46 +1,12 @@
 // Jest Snapshot v1, https://goo.gl/fbAQLP
 
 exports[`renders correctly 1`] = `
-<button
-  aria-label="add"
-  className="MuiButtonBase-root-12 MuiFab-root-2 MuiFab-secondary-5 AddButton-button-1"
-  disabled={false}
-  onBlur={[Function]}
+<AddButton
+  classes={
+    Object {
+      "button": "AddButton-button-1",
+    }
+  }
   onClick={[Function]}
-  onContextMenu={[Function]}
-  onFocus={[Function]}
-  onKeyDown={[Function]}
-  onKeyUp={[Function]}
-  onMouseDown={[Function]}
-  onMouseLeave={[Function]}
-  onMouseUp={[Function]}
-  onTouchEnd={[Function]}
-  onTouchMove={[Function]}
-  onTouchStart={[Function]}
-  tabIndex="0"
-  type="button"
->
-  <span
-    className="MuiFab-label-3"
-  >
-    <svg
-      aria-hidden="true"
-      className="MuiSvgIcon-root-15"
-      focusable="false"
-      role="presentation"
-      viewBox="0 0 24 24"
-    >
-      <path
-        d="M19 13h-6v6h-2v-6H5v-2h6V5h2v6h6v2z"
-      />
-      <path
-        d="M0 0h24v24H0z"
-        fill="none"
-      />
-    </svg>
-  </span>
-  <span
-    className="MuiTouchRipple-root-24"
-  />
-</button>
+/>
 `;
diff --git a/src/AppContainer/AppContainer.test.jsx b/src/AppContainer/AppContainer.test.jsx
index 2702400..3a67727 100644
--- a/src/AppContainer/AppContainer.test.jsx
+++ b/src/AppContainer/AppContainer.test.jsx
@@ -1,11 +1,11 @@
 import React from 'react'
-import { mount } from 'enzyme'
+import { shallow } from 'enzyme'
 
-import AppContainer from './'
+import AppContainer from '.'
 
 describe('Component Info', () => {
   it('renders correctly', () => {
-    const tree = mount((
+    const tree = shallow((
       <AppContainer>
         Foo
       </AppContainer>
diff --git a/src/AppContainer/__snapshots__/AppContainer.test.jsx.snap b/src/AppContainer/__snapshots__/AppContainer.test.jsx.snap
index 4ff732b..3c01db6 100644
--- a/src/AppContainer/__snapshots__/AppContainer.test.jsx.snap
+++ b/src/AppContainer/__snapshots__/AppContainer.test.jsx.snap
@@ -1,3 +1,3 @@
 // Jest Snapshot v1, https://goo.gl/fbAQLP
 
-exports[`Component Info renders correctly 1`] = `"Foo"`;
+exports[`Component Info renders correctly 1`] = `<withRoot(BaseComponent) />`;
diff --git a/src/BackButton/BackButton.test.jsx b/src/BackButton/BackButton.test.jsx
index 0cd4d2f..5b5ae03 100644
--- a/src/BackButton/BackButton.test.jsx
+++ b/src/BackButton/BackButton.test.jsx
@@ -1,19 +1,19 @@
 import React from 'react'
 import MockRouter from 'react-mock-router'
-import { mount } from 'enzyme'
+import { shallow } from 'enzyme'
 
 import BackButton from '.'
 
 describe('Back Button', () => {
   it('renders correctly', () => {
-    const tree = mount((<MockRouter><BackButton url="/" /></MockRouter>))
+    const tree = shallow((<MockRouter><BackButton url="/" /></MockRouter>))
 
     expect(tree).toMatchSnapshot()
   })
 
   it('updates history on click', () => {
     const push = jest.fn()
-    const button = mount(<MockRouter push={push}><BackButton url="/" /></MockRouter>)
+    const button = shallow(<MockRouter push={push}><BackButton url="/" /></MockRouter>)
 
     button.find(BackButton).simulate('click')
 
diff --git a/src/BackButton/__snapshots__/BackButton.test.jsx.snap b/src/BackButton/__snapshots__/BackButton.test.jsx.snap
index c542444..e96cac4 100644
--- a/src/BackButton/__snapshots__/BackButton.test.jsx.snap
+++ b/src/BackButton/__snapshots__/BackButton.test.jsx.snap
@@ -1,44 +1,7 @@
 // Jest Snapshot v1, https://goo.gl/fbAQLP
 
 exports[`Back Button renders correctly 1`] = `
-<button
-  className="MuiButtonBase-root-28 MuiButton-root-2 MuiButton-text-4 MuiButton-flat-7"
-  disabled={false}
-  onBlur={[Function]}
-  onClick={[Function]}
-  onFocus={[Function]}
-  onKeyDown={[Function]}
-  onKeyUp={[Function]}
-  onMouseDown={[Function]}
-  onMouseLeave={[Function]}
-  onMouseUp={[Function]}
-  onTouchEnd={[Function]}
-  onTouchMove={[Function]}
-  onTouchStart={[Function]}
-  tabIndex="0"
-  type="button"
->
-  <span
-    className="MuiButton-label-3"
-  >
-    <svg
-      aria-hidden="true"
-      className="MuiSvgIcon-root-31 BackButtonBranch-leftIcon-1"
-      focusable="false"
-      viewBox="0 0 24 24"
-    >
-      <path
-        d="M11.67 3.87L9.9 2.1 0 12l9.9 9.9 1.77-1.77L3.54 12z"
-      />
-      <path
-        d="M0 0h24v24H0z"
-        fill="none"
-      />
-    </svg>
-    Back
-  </span>
-  <span
-    className="MuiTouchRipple-root-38"
-  />
-</button>
+<withRouter(_class)
+  url="/"
+/>
 `;
diff --git a/src/Base/Base.test.jsx b/src/Base/Base.test.jsx
index dad7408..808afdc 100644
--- a/src/Base/Base.test.jsx
+++ b/src/Base/Base.test.jsx
@@ -1,12 +1,12 @@
 import React from 'react'
 import MockRouter from 'react-mock-router'
-import Enzyme, { mount } from 'enzyme'
+import Enzyme, { shallow } from 'enzyme'
 import Adapter from 'enzyme-adapter-react-16'
 import { Typography, IconButton, Button } from '@material-ui/core'
 
-import Base from './'
+import Base from '.'
 
-import menuData from '../../__tests__/data/menu'
+import menuData from '../tests/data/menu'
 import Header from '../Header'
 import Drawer from '../Drawer'
 import CookieInfo from '../CookieInfo'
@@ -15,7 +15,7 @@ Enzyme.configure({ adapter: new Adapter() })
 
 describe('Base', () => {
   it('renders correctly', () => {
-    const tree = mount((
+    const tree = shallow((
       <MockRouter>
         <Base
           title="Foo"
@@ -32,7 +32,7 @@ describe('Base', () => {
   })
 
   it('renders correctly without header', () => {
-    const tree = mount((
+    const tree = shallow((
       <MockRouter>
         <Base
           title="Foo"
@@ -50,7 +50,7 @@ describe('Base', () => {
   })
 
   it('renders with drawer open', () => {
-    const tree = mount((
+    const tree = shallow((
       <MockRouter>
         <Base
           isOpen
@@ -69,7 +69,7 @@ describe('Base', () => {
   })
 
   it('click on title', () => {
-    const tree = mount((
+    const tree = shallow((
       <MockRouter>
         <Base
           isOpen
@@ -89,7 +89,7 @@ describe('Base', () => {
   })
 
   it('click on menu icon if open changes state', () => {
-    const tree = mount((
+    const tree = shallow((
       <MockRouter>
         <Base
           isOpen
@@ -109,7 +109,7 @@ describe('Base', () => {
   })
 
   it('click on menu icon if closed changes state', () => {
-    const tree = mount((
+    const tree = shallow((
       <MockRouter>
         <Base
           isOpen={false}
@@ -129,7 +129,7 @@ describe('Base', () => {
   })
 
   it('call function when cookie is accepted', () => {
-    const tree = mount((
+    const tree = shallow((
       <MockRouter>
         <Base
           isOpen={false}
diff --git a/src/Base/__snapshots__/Base.test.jsx.snap b/src/Base/__snapshots__/Base.test.jsx.snap
index 51d6814..fe2ba71 100644
--- a/src/Base/__snapshots__/Base.test.jsx.snap
+++ b/src/Base/__snapshots__/Base.test.jsx.snap
@@ -1,1103 +1,9932 @@
 // Jest Snapshot v1, https://goo.gl/fbAQLP
 
 exports[`Base call function when cookie is accepted 1`] = `
-<div>
-  <div
-    className="Header-root-5"
-  >
-    <header
-      className="MuiPaper-root-21 MuiPaper-elevation4-27 MuiAppBar-root-13 MuiAppBar-positionFixed-14 MuiAppBar-colorPrimary-19 mui-fixed Header-appBar-6 Header-appBarShift-8"
-    >
-      <div
-        className="MuiToolbar-root-48 MuiToolbar-regular-50 MuiToolbar-gutters-49"
-      >
-        <button
-          aria-label="open drawer"
-          className="MuiButtonBase-root-58 MuiIconButton-root-52 MuiIconButton-colorInherit-53 Header-menuButton-9 Header-hide-10"
-          disabled={false}
-          onBlur={[Function]}
-          onClick={[Function]}
-          onFocus={[Function]}
-          onKeyDown={[Function]}
-          onKeyUp={[Function]}
-          onMouseDown={[Function]}
-          onMouseLeave={[Function]}
-          onMouseUp={[Function]}
-          onTouchEnd={[Function]}
-          onTouchMove={[Function]}
-          onTouchStart={[Function]}
-          tabIndex="0"
-          type="button"
-        >
-          <span
-            className="MuiIconButton-label-57"
-          >
-            <svg
-              aria-hidden="true"
-              className="MuiSvgIcon-root-61"
-              focusable="false"
-              viewBox="0 0 24 24"
-            >
-              <path
-                d="M0 0h24v24H0z"
-                fill="none"
-              />
-              <path
-                d="M3 18h18v-2H3v2zm0-5h18v-2H3v2zm0-7v2h18V6H3z"
-              />
-            </svg>
-          </span>
-          <span
-            className="MuiTouchRipple-root-68"
-          />
-        </button>
-        <h2
-          className="MuiTypography-root-75 MuiTypography-title-81 MuiTypography-colorInherit-94 Header-flex-11 Header-title-12"
-          onClick={[Function]}
-        >
-          Foo
-        </h2>
-      </div>
-    </header>
-  </div>
-  <div
-    className="BaseBranch-appFrame-1"
-  >
-    <div
-      className="MuiDrawer-docked-102"
-    >
-      <div
-        className="MuiPaper-root-21 MuiPaper-elevation0-23 MuiDrawer-paper-103 Drawer-drawerPaper-100 MuiDrawer-paperAnchorLeft-104 MuiDrawer-paperAnchorDockedLeft-108"
-        direction="right"
-        style={Object {}}
-      >
-        <div>
-          <div
-            className="Drawer-drawerHeader-101"
-          >
-            <button
-              className="MuiButtonBase-root-58 MuiIconButton-root-52"
-              disabled={false}
-              onBlur={[Function]}
-              onClick={[Function]}
-              onFocus={[Function]}
-              onKeyDown={[Function]}
-              onKeyUp={[Function]}
-              onMouseDown={[Function]}
-              onMouseLeave={[Function]}
-              onMouseUp={[Function]}
-              onTouchEnd={[Function]}
-              onTouchMove={[Function]}
-              onTouchStart={[Function]}
-              tabIndex="0"
-              type="button"
-            >
-              <span
-                className="MuiIconButton-label-57"
-              >
-                <svg
-                  aria-hidden="true"
-                  className="MuiSvgIcon-root-61"
-                  focusable="false"
-                  viewBox="0 0 24 24"
-                >
-                  <path
-                    d="M15.41 7.41L14 6l-6 6 6 6 1.41-1.41L10.83 12z"
-                  />
-                  <path
-                    d="M0 0h24v24H0z"
-                    fill="none"
-                  />
-                </svg>
-              </span>
-              <span
-                className="MuiTouchRipple-root-68"
-              />
-            </button>
-          </div>
-          <hr
-            className="MuiDivider-root-113"
-          />
-          <div
-            className="Menu-root-117"
-          >
-            <ul
-              className="MuiList-root-118 MuiList-padding-119"
-            >
-              <div
-                className="MuiButtonBase-root-58 MuiListItem-root-123 MuiListItem-default-126 MuiListItem-gutters-130 MuiListItem-button-131"
-                onBlur={[Function]}
-                onClick={[Function]}
-                onFocus={[Function]}
-                onKeyDown={[Function]}
-                onKeyUp={[Function]}
-                onMouseDown={[Function]}
-                onMouseLeave={[Function]}
-                onMouseUp={[Function]}
-                onTouchEnd={[Function]}
-                onTouchMove={[Function]}
-                onTouchStart={[Function]}
-                role="button"
-                tabIndex="0"
-              >
-                <div
-                  className="MuiListItemText-root-134"
-                >
-                  <span
-                    className="MuiTypography-root-75 MuiTypography-subheading-82 MuiListItemText-primary-137"
-                  >
-                    Dashboard
-                  </span>
-                </div>
-                <span
-                  className="MuiTouchRipple-root-68"
-                />
-              </div>
-              <div
-                className="MuiButtonBase-root-58 MuiListItem-root-123 MuiListItem-default-126 MuiListItem-gutters-130 MuiListItem-button-131 MenuItem-isDisabled-122"
-                onBlur={[Function]}
-                onClick={[Function]}
-                onFocus={[Function]}
-                onKeyDown={[Function]}
-                onKeyUp={[Function]}
-                onMouseDown={[Function]}
-                onMouseLeave={[Function]}
-                onMouseUp={[Function]}
-                onTouchEnd={[Function]}
-                onTouchMove={[Function]}
-                onTouchStart={[Function]}
-                role="button"
-                tabIndex="0"
-              >
-                <div
-                  className="MuiListItemText-root-134"
-                >
-                  <span
-                    className="MuiTypography-root-75 MuiTypography-subheading-82 MuiListItemText-primary-137"
-                  >
-                    New portfolio
-                  </span>
-                </div>
-                <span
-                  className="MuiTouchRipple-root-68"
-                />
-              </div>
-              <hr
-                className="MuiDivider-root-113"
-              />
-              <div
-                className="MuiButtonBase-root-58 MuiListItem-root-123 MuiListItem-default-126 MuiListItem-gutters-130 MuiListItem-button-131"
-                onBlur={[Function]}
-                onClick={[Function]}
-                onFocus={[Function]}
-                onKeyDown={[Function]}
-                onKeyUp={[Function]}
-                onMouseDown={[Function]}
-                onMouseLeave={[Function]}
-                onMouseUp={[Function]}
-                onTouchEnd={[Function]}
-                onTouchMove={[Function]}
-                onTouchStart={[Function]}
-                role="button"
-                tabIndex="0"
-              >
-                <svg
-                  aria-hidden="true"
-                  className="MuiSvgIcon-root-61 MuiListItemIcon-root-140"
-                  focusable="false"
-                  viewBox="0 0 24 24"
-                >
-                  <path
-                    d="M0 0h24v24H0z"
-                    fill="none"
-                  />
-                  <path
-                    d="M20 8h-2.81c-.45-.78-1.07-1.45-1.82-1.96L17 4.41 15.59 3l-2.17 2.17C12.96 5.06 12.49 5 12 5c-.49 0-.96.06-1.41.17L8.41 3 7 4.41l1.62 1.63C7.88 6.55 7.26 7.22 6.81 8H4v2h2.09c-.05.33-.09.66-.09 1v1H4v2h2v1c0 .34.04.67.09 1H4v2h2.81c1.04 1.79 2.97 3 5.19 3s4.15-1.21 5.19-3H20v-2h-2.09c.05-.33.09-.66.09-1v-1h2v-2h-2v-1c0-.34-.04-.67-.09-1H20V8zm-6 8h-4v-2h4v2zm0-4h-4v-2h4v2z"
-                  />
-                </svg>
-                <div
-                  className="MuiListItemText-root-134"
-                >
-                  <span
-                    className="MuiTypography-root-75 MuiTypography-subheading-82 MuiListItemText-primary-137"
-                  >
-                    Report a bug
-                  </span>
-                </div>
-                <span
-                  className="MuiTouchRipple-root-68"
-                />
-              </div>
-            </ul>
-          </div>
-        </div>
-      </div>
-    </div>
-    <main
-      className="BaseBranch-content-3 BaseBranch-contentShift-4"
-    >
-      <div
-        className="CookieInfo-root-141"
-      >
-        <div
-          className="CookieInfo-content-143"
-        />
-        <button
-          className="MuiButtonBase-root-58 MuiButton-root-145 MuiButton-text-147 MuiButton-flat-150 CookieInfo-button-144"
-          disabled={false}
-          onBlur={[Function]}
-          onClick={[Function]}
-          onFocus={[Function]}
-          onKeyDown={[Function]}
-          onKeyUp={[Function]}
-          onMouseDown={[Function]}
-          onMouseLeave={[Function]}
-          onMouseUp={[Function]}
-          onTouchEnd={[Function]}
-          onTouchMove={[Function]}
-          onTouchStart={[Function]}
-          tabIndex="0"
-          type="button"
-        >
-          <span
-            className="MuiButton-label-146"
-          >
-            Accept
-          </span>
-          <span
-            className="MuiTouchRipple-root-68"
-          />
-        </button>
-      </div>
-      <div
-        hasCookieInfo={true}
-        history={
-          Object {
-            "createHref": [Function],
-            "path": "",
-            "push": [Function],
-            "replace": [Function],
-          }
-        }
-        isOpen={false}
-        key=".1"
-        location=""
-        match={
-          Object {
-            "params": Object {},
-            "path": "",
-            "url": "",
-          }
-        }
-        menuOpen={true}
-        onAccept={[Function]}
-      >
-        Foo
-      </div>
-    </main>
-  </div>
-</div>
-`;
-
-exports[`Base click on menu icon if closed changes state 1`] = `
-<div>
-  <div
-    className="Header-root-5"
-  >
-    <header
-      className="MuiPaper-root-21 MuiPaper-elevation4-27 MuiAppBar-root-13 MuiAppBar-positionFixed-14 MuiAppBar-colorPrimary-19 mui-fixed Header-appBar-6 Header-appBarWithCookieInfo-7"
-    >
-      <div
-        className="MuiToolbar-root-48 MuiToolbar-regular-50 MuiToolbar-gutters-49"
-      >
-        <button
-          aria-label="open drawer"
-          className="MuiButtonBase-root-58 MuiIconButton-root-52 MuiIconButton-colorInherit-53 Header-menuButton-9"
-          disabled={false}
-          onBlur={[Function]}
-          onClick={[Function]}
-          onFocus={[Function]}
-          onKeyDown={[Function]}
-          onKeyUp={[Function]}
-          onMouseDown={[Function]}
-          onMouseLeave={[Function]}
-          onMouseUp={[Function]}
-          onTouchEnd={[Function]}
-          onTouchMove={[Function]}
-          onTouchStart={[Function]}
-          tabIndex="0"
-          type="button"
-        >
-          <span
-            className="MuiIconButton-label-57"
-          >
-            <svg
-              aria-hidden="true"
-              className="MuiSvgIcon-root-61"
-              focusable="false"
-              viewBox="0 0 24 24"
-            >
-              <path
-                d="M0 0h24v24H0z"
-                fill="none"
-              />
-              <path
-                d="M3 18h18v-2H3v2zm0-5h18v-2H3v2zm0-7v2h18V6H3z"
-              />
-            </svg>
-          </span>
-          <span
-            className="MuiTouchRipple-root-68"
-          />
-        </button>
-        <h2
-          className="MuiTypography-root-75 MuiTypography-title-81 MuiTypography-colorInherit-94 Header-flex-11 Header-title-12"
-          onClick={[Function]}
-        >
-          Foo
-        </h2>
-      </div>
-    </header>
-  </div>
-  <div
-    className="BaseBranch-appFrame-1 BaseBranch-appFrameWithCookieInfo-2"
-  >
-    <div
-      className="MuiDrawer-docked-102"
-    >
-      <div
-        className="MuiPaper-root-21 MuiPaper-elevation0-23 MuiDrawer-paper-103 Drawer-drawerPaper-100 MuiDrawer-paperAnchorLeft-104 MuiDrawer-paperAnchorDockedLeft-108"
-        direction="right"
-        style={Object {}}
-      >
-        <div>
-          <div
-            className="Drawer-drawerHeader-101"
-          >
-            <button
-              className="MuiButtonBase-root-58 MuiIconButton-root-52"
-              disabled={false}
-              onBlur={[Function]}
-              onClick={[Function]}
-              onFocus={[Function]}
-              onKeyDown={[Function]}
-              onKeyUp={[Function]}
-              onMouseDown={[Function]}
-              onMouseLeave={[Function]}
-              onMouseUp={[Function]}
-              onTouchEnd={[Function]}
-              onTouchMove={[Function]}
-              onTouchStart={[Function]}
-              tabIndex="0"
-              type="button"
-            >
-              <span
-                className="MuiIconButton-label-57"
-              >
-                <svg
-                  aria-hidden="true"
-                  className="MuiSvgIcon-root-61"
-                  focusable="false"
-                  viewBox="0 0 24 24"
-                >
-                  <path
-                    d="M15.41 7.41L14 6l-6 6 6 6 1.41-1.41L10.83 12z"
-                  />
-                  <path
-                    d="M0 0h24v24H0z"
-                    fill="none"
-                  />
-                </svg>
-              </span>
-              <span
-                className="MuiTouchRipple-root-68"
-              />
-            </button>
-          </div>
-          <hr
-            className="MuiDivider-root-113"
-          />
-          <div
-            className="Menu-root-117"
-          >
-            <ul
-              className="MuiList-root-118 MuiList-padding-119"
-            >
-              <div
-                className="MuiButtonBase-root-58 MuiListItem-root-123 MuiListItem-default-126 MuiListItem-gutters-130 MuiListItem-button-131"
-                onBlur={[Function]}
-                onClick={[Function]}
-                onFocus={[Function]}
-                onKeyDown={[Function]}
-                onKeyUp={[Function]}
-                onMouseDown={[Function]}
-                onMouseLeave={[Function]}
-                onMouseUp={[Function]}
-                onTouchEnd={[Function]}
-                onTouchMove={[Function]}
-                onTouchStart={[Function]}
-                role="button"
-                tabIndex="0"
-              >
-                <div
-                  className="MuiListItemText-root-134"
-                >
-                  <span
-                    className="MuiTypography-root-75 MuiTypography-subheading-82 MuiListItemText-primary-137"
-                  >
-                    Dashboard
-                  </span>
-                </div>
-                <span
-                  className="MuiTouchRipple-root-68"
-                />
-              </div>
-              <div
-                className="MuiButtonBase-root-58 MuiListItem-root-123 MuiListItem-default-126 MuiListItem-gutters-130 MuiListItem-button-131 MenuItem-isDisabled-122"
-                onBlur={[Function]}
-                onClick={[Function]}
-                onFocus={[Function]}
-                onKeyDown={[Function]}
-                onKeyUp={[Function]}
-                onMouseDown={[Function]}
-                onMouseLeave={[Function]}
-                onMouseUp={[Function]}
-                onTouchEnd={[Function]}
-                onTouchMove={[Function]}
-                onTouchStart={[Function]}
-                role="button"
-                tabIndex="0"
-              >
-                <div
-                  className="MuiListItemText-root-134"
-                >
-                  <span
-                    className="MuiTypography-root-75 MuiTypography-subheading-82 MuiListItemText-primary-137"
-                  >
-                    New portfolio
-                  </span>
-                </div>
-                <span
-                  className="MuiTouchRipple-root-68"
-                />
-              </div>
-              <hr
-                className="MuiDivider-root-113"
-              />
-              <div
-                className="MuiButtonBase-root-58 MuiListItem-root-123 MuiListItem-default-126 MuiListItem-gutters-130 MuiListItem-button-131"
-                onBlur={[Function]}
-                onClick={[Function]}
-                onFocus={[Function]}
-                onKeyDown={[Function]}
-                onKeyUp={[Function]}
-                onMouseDown={[Function]}
-                onMouseLeave={[Function]}
-                onMouseUp={[Function]}
-                onTouchEnd={[Function]}
-                onTouchMove={[Function]}
-                onTouchStart={[Function]}
-                role="button"
-                tabIndex="0"
-              >
-                <svg
-                  aria-hidden="true"
-                  className="MuiSvgIcon-root-61 MuiListItemIcon-root-140"
-                  focusable="false"
-                  viewBox="0 0 24 24"
-                >
-                  <path
-                    d="M0 0h24v24H0z"
-                    fill="none"
-                  />
-                  <path
-                    d="M20 8h-2.81c-.45-.78-1.07-1.45-1.82-1.96L17 4.41 15.59 3l-2.17 2.17C12.96 5.06 12.49 5 12 5c-.49 0-.96.06-1.41.17L8.41 3 7 4.41l1.62 1.63C7.88 6.55 7.26 7.22 6.81 8H4v2h2.09c-.05.33-.09.66-.09 1v1H4v2h2v1c0 .34.04.67.09 1H4v2h2.81c1.04 1.79 2.97 3 5.19 3s4.15-1.21 5.19-3H20v-2h-2.09c.05-.33.09-.66.09-1v-1h2v-2h-2v-1c0-.34-.04-.67-.09-1H20V8zm-6 8h-4v-2h4v2zm0-4h-4v-2h4v2z"
-                  />
-                </svg>
-                <div
-                  className="MuiListItemText-root-134"
-                >
-                  <span
-                    className="MuiTypography-root-75 MuiTypography-subheading-82 MuiListItemText-primary-137"
-                  >
-                    Report a bug
-                  </span>
-                </div>
-                <span
-                  className="MuiTouchRipple-root-68"
-                />
-              </div>
-            </ul>
-          </div>
-        </div>
-      </div>
-    </div>
-    <main
-      className="BaseBranch-content-3"
-    >
-      <div
-        hasCookieInfo={true}
-        history={
-          Object {
-            "createHref": [Function],
-            "path": "",
-            "push": [Function],
-            "replace": [Function],
-          }
-        }
-        isOpen={false}
-        key=".0"
-        location=""
-        match={
-          Object {
-            "params": Object {},
-            "path": "",
-            "url": "",
-          }
-        }
-        menuOpen={true}
-        onAccept={[Function]}
-      >
-        Foo
-      </div>
-    </main>
-  </div>
-</div>
-`;
-
-exports[`Base click on menu icon if open changes state 1`] = `
-<div>
-  <div
-    className="Header-root-5"
-  >
-    <header
-      className="MuiPaper-root-21 MuiPaper-elevation4-27 MuiAppBar-root-13 MuiAppBar-positionFixed-14 MuiAppBar-colorPrimary-19 mui-fixed Header-appBar-6 Header-appBarShift-8 Header-appBarWithCookieInfo-7"
-    >
-      <div
-        className="MuiToolbar-root-48 MuiToolbar-regular-50 MuiToolbar-gutters-49"
-      >
-        <button
-          aria-label="open drawer"
-          className="MuiButtonBase-root-58 MuiIconButton-root-52 MuiIconButton-colorInherit-53 Header-menuButton-9 Header-hide-10"
-          disabled={false}
-          onBlur={[Function]}
-          onClick={[Function]}
-          onFocus={[Function]}
-          onKeyDown={[Function]}
-          onKeyUp={[Function]}
-          onMouseDown={[Function]}
-          onMouseLeave={[Function]}
-          onMouseUp={[Function]}
-          onTouchEnd={[Function]}
-          onTouchMove={[Function]}
-          onTouchStart={[Function]}
-          tabIndex="0"
-          type="button"
-        >
-          <span
-            className="MuiIconButton-label-57"
-          >
-            <svg
-              aria-hidden="true"
-              className="MuiSvgIcon-root-61"
-              focusable="false"
-              viewBox="0 0 24 24"
-            >
-              <path
-                d="M0 0h24v24H0z"
-                fill="none"
-              />
-              <path
-                d="M3 18h18v-2H3v2zm0-5h18v-2H3v2zm0-7v2h18V6H3z"
-              />
-            </svg>
-          </span>
-          <span
-            className="MuiTouchRipple-root-68"
-          />
-        </button>
-        <h2
-          className="MuiTypography-root-75 MuiTypography-title-81 MuiTypography-colorInherit-94 Header-flex-11 Header-title-12"
-          onClick={[Function]}
-        >
-          Foo
-        </h2>
-      </div>
-    </header>
-  </div>
-  <div
-    className="BaseBranch-appFrame-1 BaseBranch-appFrameWithCookieInfo-2"
-  >
-    <div
-      className="MuiDrawer-docked-102"
-    >
-      <div
-        className="MuiPaper-root-21 MuiPaper-elevation0-23 MuiDrawer-paper-103 Drawer-drawerPaper-100 MuiDrawer-paperAnchorLeft-104 MuiDrawer-paperAnchorDockedLeft-108"
-        direction="right"
-        style={Object {}}
-      >
-        <div>
-          <div
-            className="Drawer-drawerHeader-101"
-          >
-            <button
-              className="MuiButtonBase-root-58 MuiIconButton-root-52"
-              disabled={false}
-              onBlur={[Function]}
-              onClick={[Function]}
-              onFocus={[Function]}
-              onKeyDown={[Function]}
-              onKeyUp={[Function]}
-              onMouseDown={[Function]}
-              onMouseLeave={[Function]}
-              onMouseUp={[Function]}
-              onTouchEnd={[Function]}
-              onTouchMove={[Function]}
-              onTouchStart={[Function]}
-              tabIndex="0"
-              type="button"
-            >
-              <span
-                className="MuiIconButton-label-57"
-              >
-                <svg
-                  aria-hidden="true"
-                  className="MuiSvgIcon-root-61"
-                  focusable="false"
-                  viewBox="0 0 24 24"
-                >
-                  <path
-                    d="M15.41 7.41L14 6l-6 6 6 6 1.41-1.41L10.83 12z"
-                  />
-                  <path
-                    d="M0 0h24v24H0z"
-                    fill="none"
-                  />
-                </svg>
-              </span>
-              <span
-                className="MuiTouchRipple-root-68"
-              />
-            </button>
-          </div>
-          <hr
-            className="MuiDivider-root-113"
-          />
-          <div
-            className="Menu-root-117"
-          >
-            <ul
-              className="MuiList-root-118 MuiList-padding-119"
-            >
-              <div
-                className="MuiButtonBase-root-58 MuiListItem-root-123 MuiListItem-default-126 MuiListItem-gutters-130 MuiListItem-button-131"
-                onBlur={[Function]}
-                onClick={[Function]}
-                onFocus={[Function]}
-                onKeyDown={[Function]}
-                onKeyUp={[Function]}
-                onMouseDown={[Function]}
-                onMouseLeave={[Function]}
-                onMouseUp={[Function]}
-                onTouchEnd={[Function]}
-                onTouchMove={[Function]}
-                onTouchStart={[Function]}
-                role="button"
-                tabIndex="0"
-              >
-                <div
-                  className="MuiListItemText-root-134"
-                >
-                  <span
-                    className="MuiTypography-root-75 MuiTypography-subheading-82 MuiListItemText-primary-137"
-                  >
-                    Dashboard
-                  </span>
-                </div>
-                <span
-                  className="MuiTouchRipple-root-68"
-                />
-              </div>
-              <div
-                className="MuiButtonBase-root-58 MuiListItem-root-123 MuiListItem-default-126 MuiListItem-gutters-130 MuiListItem-button-131 MenuItem-isDisabled-122"
-                onBlur={[Function]}
-                onClick={[Function]}
-                onFocus={[Function]}
-                onKeyDown={[Function]}
-                onKeyUp={[Function]}
-                onMouseDown={[Function]}
-                onMouseLeave={[Function]}
-                onMouseUp={[Function]}
-                onTouchEnd={[Function]}
-                onTouchMove={[Function]}
-                onTouchStart={[Function]}
-                role="button"
-                tabIndex="0"
-              >
-                <div
-                  className="MuiListItemText-root-134"
-                >
-                  <span
-                    className="MuiTypography-root-75 MuiTypography-subheading-82 MuiListItemText-primary-137"
-                  >
-                    New portfolio
-                  </span>
-                </div>
-                <span
-                  className="MuiTouchRipple-root-68"
-                />
-              </div>
-              <hr
-                className="MuiDivider-root-113"
-              />
-              <div
-                className="MuiButtonBase-root-58 MuiListItem-root-123 MuiListItem-default-126 MuiListItem-gutters-130 MuiListItem-button-131"
-                onBlur={[Function]}
-                onClick={[Function]}
-                onFocus={[Function]}
-                onKeyDown={[Function]}
-                onKeyUp={[Function]}
-                onMouseDown={[Function]}
-                onMouseLeave={[Function]}
-                onMouseUp={[Function]}
-                onTouchEnd={[Function]}
-                onTouchMove={[Function]}
-                onTouchStart={[Function]}
-                role="button"
-                tabIndex="0"
-              >
-                <svg
-                  aria-hidden="true"
-                  className="MuiSvgIcon-root-61 MuiListItemIcon-root-140"
-                  focusable="false"
-                  viewBox="0 0 24 24"
-                >
-                  <path
-                    d="M0 0h24v24H0z"
-                    fill="none"
-                  />
-                  <path
-                    d="M20 8h-2.81c-.45-.78-1.07-1.45-1.82-1.96L17 4.41 15.59 3l-2.17 2.17C12.96 5.06 12.49 5 12 5c-.49 0-.96.06-1.41.17L8.41 3 7 4.41l1.62 1.63C7.88 6.55 7.26 7.22 6.81 8H4v2h2.09c-.05.33-.09.66-.09 1v1H4v2h2v1c0 .34.04.67.09 1H4v2h2.81c1.04 1.79 2.97 3 5.19 3s4.15-1.21 5.19-3H20v-2h-2.09c.05-.33.09-.66.09-1v-1h2v-2h-2v-1c0-.34-.04-.67-.09-1H20V8zm-6 8h-4v-2h4v2zm0-4h-4v-2h4v2z"
-                  />
-                </svg>
-                <div
-                  className="MuiListItemText-root-134"
-                >
-                  <span
-                    className="MuiTypography-root-75 MuiTypography-subheading-82 MuiListItemText-primary-137"
-                  >
-                    Report a bug
-                  </span>
-                </div>
-                <span
-                  className="MuiTouchRipple-root-68"
-                />
-              </div>
-            </ul>
-          </div>
-        </div>
-      </div>
-    </div>
-    <main
-      className="BaseBranch-content-3 BaseBranch-contentShift-4"
-    >
-      <div
-        hasCookieInfo={true}
-        history={
+<MockRouter
+  createHref={[Function]}
+  location=""
+  params={Object {}}
+  path=""
+  push={[Function]}
+  replace={[Function]}
+  url=""
+>
+  <_class
+    hasCookieInfo={true}
+    hasHeader={true}
+    isHeaderFixed={true}
+    isOpen={false}
+    menuData={
+      Array [
+        Object {
+          "icon": null,
+          "title": "Dashboard",
+          "type": "link",
+          "url": "/",
+        },
+        Object {
+          "isDisabled": true,
+          "title": "New portfolio",
+          "type": "link",
+          "url": "/portfolio",
+        },
+        Object {
+          "type": "divider",
+        },
+        Object {
+          "icon": Object {
+            "$$typeof": Symbol(react.memo),
+            "compare": null,
+            "displayName": "BugReportIcon",
+            "muiName": "SvgIcon",
+            "type": Object {
+              "$$typeof": Symbol(react.forward_ref),
+              "render": [Function],
+            },
+          },
+          "title": "Report a bug",
+          "type": "link",
+          "url": "/bug",
+        },
+      ]
+    }
+    menuOpen={true}
+    rightContent={null}
+    title="Foo"
+  >
+    <WithStyles(BaseBranch)
+      cookieInfoOpen={false}
+      handleDrawerClose={[Function]}
+      handleDrawerOpen={[Function]}
+      hasCookieInfo={true}
+      hasHeader={true}
+      isHeaderFixed={true}
+      isOpen={false}
+      menuData={
+        Array [
           Object {
-            "createHref": [Function],
-            "path": "",
-            "push": [Function],
-            "replace": [Function],
-          }
-        }
-        isOpen={true}
-        key=".0"
-        location=""
-        match={
+            "icon": null,
+            "title": "Dashboard",
+            "type": "link",
+            "url": "/",
+          },
           Object {
-            "params": Object {},
-            "path": "",
-            "url": "",
+            "isDisabled": true,
+            "title": "New portfolio",
+            "type": "link",
+            "url": "/portfolio",
+          },
+          Object {
+            "type": "divider",
+          },
+          Object {
+            "icon": Object {
+              "$$typeof": Symbol(react.memo),
+              "compare": null,
+              "displayName": "BugReportIcon",
+              "muiName": "SvgIcon",
+              "type": Object {
+                "$$typeof": Symbol(react.forward_ref),
+                "render": [Function],
+              },
+            },
+            "title": "Report a bug",
+            "type": "link",
+            "url": "/bug",
+          },
+        ]
+      }
+      menuOpen={true}
+      onClick={[Function]}
+      onCookieInfoAccept={[Function]}
+      open={true}
+      redirectTo={[Function]}
+      rightContent={null}
+      title="Foo"
+    >
+      <BaseBranch
+        classes={
+          Object {
+            "appFrame": "BaseBranch-appFrame-1",
+            "appFrameWithCookieInfo": "BaseBranch-appFrameWithCookieInfo-2",
+            "content": "BaseBranch-content-3",
+            "contentShift": "BaseBranch-contentShift-4",
           }
         }
-        menuOpen={true}
-        onAccept={[Function]}
-      >
-        Foo
-      </div>
-    </main>
-  </div>
-</div>
-`;
-
-exports[`Base click on title 1`] = `
-<div>
-  <div
-    className="Header-root-5"
-  >
-    <header
-      className="MuiPaper-root-21 MuiPaper-elevation4-27 MuiAppBar-root-13 MuiAppBar-positionFixed-14 MuiAppBar-colorPrimary-19 mui-fixed Header-appBar-6 Header-appBarShift-8 Header-appBarWithCookieInfo-7"
-    >
-      <div
-        className="MuiToolbar-root-48 MuiToolbar-regular-50 MuiToolbar-gutters-49"
-      >
-        <button
-          aria-label="open drawer"
-          className="MuiButtonBase-root-58 MuiIconButton-root-52 MuiIconButton-colorInherit-53 Header-menuButton-9 Header-hide-10"
-          disabled={false}
-          onBlur={[Function]}
-          onClick={[Function]}
-          onFocus={[Function]}
-          onKeyDown={[Function]}
-          onKeyUp={[Function]}
-          onMouseDown={[Function]}
-          onMouseLeave={[Function]}
-          onMouseUp={[Function]}
-          onTouchEnd={[Function]}
-          onTouchMove={[Function]}
-          onTouchStart={[Function]}
-          tabIndex="0"
-          type="button"
-        >
-          <span
-            className="MuiIconButton-label-57"
-          >
-            <svg
-              aria-hidden="true"
-              className="MuiSvgIcon-root-61"
-              focusable="false"
-              viewBox="0 0 24 24"
-            >
-              <path
-                d="M0 0h24v24H0z"
-                fill="none"
-              />
-              <path
-                d="M3 18h18v-2H3v2zm0-5h18v-2H3v2zm0-7v2h18V6H3z"
-              />
-            </svg>
-          </span>
-          <span
-            className="MuiTouchRipple-root-68"
-          />
-        </button>
-        <h2
-          className="MuiTypography-root-75 MuiTypography-title-81 MuiTypography-colorInherit-94 Header-flex-11 Header-title-12"
-          onClick={[Function]}
-        >
-          Foo
-        </h2>
-      </div>
-    </header>
-  </div>
-  <div
-    className="BaseBranch-appFrame-1 BaseBranch-appFrameWithCookieInfo-2"
-  >
-    <div
-      className="MuiDrawer-docked-102"
-    >
-      <div
-        className="MuiPaper-root-21 MuiPaper-elevation0-23 MuiDrawer-paper-103 Drawer-drawerPaper-100 MuiDrawer-paperAnchorLeft-104 MuiDrawer-paperAnchorDockedLeft-108"
-        direction="right"
-        style={Object {}}
-      >
-        <div>
-          <div
-            className="Drawer-drawerHeader-101"
-          >
-            <button
-              className="MuiButtonBase-root-58 MuiIconButton-root-52"
-              disabled={false}
-              onBlur={[Function]}
-              onClick={[Function]}
-              onFocus={[Function]}
-              onKeyDown={[Function]}
-              onKeyUp={[Function]}
-              onMouseDown={[Function]}
-              onMouseLeave={[Function]}
-              onMouseUp={[Function]}
-              onTouchEnd={[Function]}
-              onTouchMove={[Function]}
-              onTouchStart={[Function]}
-              tabIndex="0"
-              type="button"
-            >
-              <span
-                className="MuiIconButton-label-57"
-              >
-                <svg
-                  aria-hidden="true"
-                  className="MuiSvgIcon-root-61"
-                  focusable="false"
-                  viewBox="0 0 24 24"
-                >
-                  <path
-                    d="M15.41 7.41L14 6l-6 6 6 6 1.41-1.41L10.83 12z"
-                  />
-                  <path
-                    d="M0 0h24v24H0z"
-                    fill="none"
-                  />
-                </svg>
-              </span>
-              <span
-                className="MuiTouchRipple-root-68"
-              />
-            </button>
-          </div>
-          <hr
-            className="MuiDivider-root-113"
-          />
-          <div
-            className="Menu-root-117"
-          >
-            <ul
-              className="MuiList-root-118 MuiList-padding-119"
-            >
-              <div
-                className="MuiButtonBase-root-58 MuiListItem-root-123 MuiListItem-default-126 MuiListItem-gutters-130 MuiListItem-button-131"
-                onBlur={[Function]}
-                onClick={[Function]}
-                onFocus={[Function]}
-                onKeyDown={[Function]}
-                onKeyUp={[Function]}
-                onMouseDown={[Function]}
-                onMouseLeave={[Function]}
-                onMouseUp={[Function]}
-                onTouchEnd={[Function]}
-                onTouchMove={[Function]}
-                onTouchStart={[Function]}
-                role="button"
-                tabIndex="0"
+        cookieInfoOpen={false}
+        handleDrawerClose={[Function]}
+        handleDrawerOpen={[Function]}
+        hasCookieInfo={true}
+        hasHeader={true}
+        isHeaderFixed={true}
+        isOpen={false}
+        menuData={
+          Array [
+            Object {
+              "icon": null,
+              "title": "Dashboard",
+              "type": "link",
+              "url": "/",
+            },
+            Object {
+              "isDisabled": true,
+              "title": "New portfolio",
+              "type": "link",
+              "url": "/portfolio",
+            },
+            Object {
+              "type": "divider",
+            },
+            Object {
+              "icon": Object {
+                "$$typeof": Symbol(react.memo),
+                "compare": null,
+                "displayName": "BugReportIcon",
+                "muiName": "SvgIcon",
+                "type": Object {
+                  "$$typeof": Symbol(react.forward_ref),
+                  "render": [Function],
+                },
+              },
+              "title": "Report a bug",
+              "type": "link",
+              "url": "/bug",
+            },
+          ]
+        }
+        menuOpen={true}
+        onClick={[Function]}
+        onCookieInfoAccept={[Function]}
+        open={true}
+        redirectTo={[Function]}
+        rightContent={null}
+        title="Foo"
+      >
+        <div>
+          <WithStyles(Header)
+            isCookieInfoOpen={false}
+            isFixed={true}
+            isOpen={true}
+            onClick={[Function]}
+            onDrawerOpen={[Function]}
+            title="Foo"
+          >
+            <Header
+              classes={
+                Object {
+                  "appBar": "Header-appBar-6",
+                  "appBarShift": "Header-appBarShift-8",
+                  "appBarWithCookieInfo": "Header-appBarWithCookieInfo-7",
+                  "flex": "Header-flex-11",
+                  "hide": "Header-hide-10",
+                  "menuButton": "Header-menuButton-9",
+                  "root": "Header-root-5",
+                  "title": "Header-title-12",
+                }
+              }
+              isCookieInfoOpen={false}
+              isFixed={true}
+              isOpen={true}
+              onClick={[Function]}
+              onDrawerOpen={[Function]}
+              title="Foo"
+            >
+              <div
+                className="Header-root-5"
               >
-                <div
-                  className="MuiListItemText-root-134"
+                <WithStyles(ForwardRef(AppBar))
+                  className="Header-appBar-6 Header-appBarShift-8"
+                  position="fixed"
                 >
-                  <span
-                    className="MuiTypography-root-75 MuiTypography-subheading-82 MuiListItemText-primary-137"
+                  <ForwardRef(AppBar)
+                    className="Header-appBar-6 Header-appBarShift-8"
+                    classes={
+                      Object {
+                        "colorDefault": "MuiAppBar-colorDefault",
+                        "colorPrimary": "MuiAppBar-colorPrimary",
+                        "colorSecondary": "MuiAppBar-colorSecondary",
+                        "positionAbsolute": "MuiAppBar-positionAbsolute",
+                        "positionFixed": "MuiAppBar-positionFixed",
+                        "positionRelative": "MuiAppBar-positionRelative",
+                        "positionStatic": "MuiAppBar-positionStatic",
+                        "positionSticky": "MuiAppBar-positionSticky",
+                        "root": "MuiAppBar-root",
+                      }
+                    }
+                    position="fixed"
                   >
-                    Dashboard
-                  </span>
-                </div>
-                <span
-                  className="MuiTouchRipple-root-68"
-                />
+                    <WithStyles(ForwardRef(Paper))
+                      className="MuiAppBar-root MuiAppBar-positionFixed Header-appBar-6 Header-appBarShift-8 MuiAppBar-colorPrimary mui-fixed"
+                      component="header"
+                      elevation={4}
+                      square={true}
+                    >
+                      <ForwardRef(Paper)
+                        className="MuiAppBar-root MuiAppBar-positionFixed Header-appBar-6 Header-appBarShift-8 MuiAppBar-colorPrimary mui-fixed"
+                        classes={
+                          Object {
+                            "elevation0": "MuiPaper-elevation0",
+                            "elevation1": "MuiPaper-elevation1",
+                            "elevation10": "MuiPaper-elevation10",
+                            "elevation11": "MuiPaper-elevation11",
+                            "elevation12": "MuiPaper-elevation12",
+                            "elevation13": "MuiPaper-elevation13",
+                            "elevation14": "MuiPaper-elevation14",
+                            "elevation15": "MuiPaper-elevation15",
+                            "elevation16": "MuiPaper-elevation16",
+                            "elevation17": "MuiPaper-elevation17",
+                            "elevation18": "MuiPaper-elevation18",
+                            "elevation19": "MuiPaper-elevation19",
+                            "elevation2": "MuiPaper-elevation2",
+                            "elevation20": "MuiPaper-elevation20",
+                            "elevation21": "MuiPaper-elevation21",
+                            "elevation22": "MuiPaper-elevation22",
+                            "elevation23": "MuiPaper-elevation23",
+                            "elevation24": "MuiPaper-elevation24",
+                            "elevation3": "MuiPaper-elevation3",
+                            "elevation4": "MuiPaper-elevation4",
+                            "elevation5": "MuiPaper-elevation5",
+                            "elevation6": "MuiPaper-elevation6",
+                            "elevation7": "MuiPaper-elevation7",
+                            "elevation8": "MuiPaper-elevation8",
+                            "elevation9": "MuiPaper-elevation9",
+                            "root": "MuiPaper-root",
+                            "rounded": "MuiPaper-rounded",
+                          }
+                        }
+                        component="header"
+                        elevation={4}
+                        square={true}
+                      >
+                        <header
+                          className="MuiPaper-root MuiPaper-elevation4 MuiAppBar-root MuiAppBar-positionFixed Header-appBar-6 Header-appBarShift-8 MuiAppBar-colorPrimary mui-fixed"
+                        >
+                          <WithStyles(ForwardRef(Toolbar))>
+                            <ForwardRef(Toolbar)
+                              classes={
+                                Object {
+                                  "dense": "MuiToolbar-dense",
+                                  "gutters": "MuiToolbar-gutters",
+                                  "regular": "MuiToolbar-regular",
+                                  "root": "MuiToolbar-root",
+                                }
+                              }
+                            >
+                              <div
+                                className="MuiToolbar-root MuiToolbar-regular MuiToolbar-gutters"
+                              >
+                                <WithStyles(ForwardRef(IconButton))
+                                  aria-label="open drawer"
+                                  className="Header-menuButton-9 Header-hide-10"
+                                  color="inherit"
+                                  onClick={[Function]}
+                                >
+                                  <ForwardRef(IconButton)
+                                    aria-label="open drawer"
+                                    className="Header-menuButton-9 Header-hide-10"
+                                    classes={
+                                      Object {
+                                        "colorInherit": "MuiIconButton-colorInherit",
+                                        "colorPrimary": "MuiIconButton-colorPrimary",
+                                        "colorSecondary": "MuiIconButton-colorSecondary",
+                                        "disabled": "Mui-disabled",
+                                        "edgeEnd": "MuiIconButton-edgeEnd",
+                                        "edgeStart": "MuiIconButton-edgeStart",
+                                        "label": "MuiIconButton-label",
+                                        "root": "MuiIconButton-root",
+                                        "sizeSmall": "MuiIconButton-sizeSmall",
+                                      }
+                                    }
+                                    color="inherit"
+                                    onClick={[Function]}
+                                  >
+                                    <WithStyles(ForwardRef(ButtonBase))
+                                      aria-label="open drawer"
+                                      centerRipple={true}
+                                      className="MuiIconButton-root Header-menuButton-9 Header-hide-10 MuiIconButton-colorInherit"
+                                      disabled={false}
+                                      focusRipple={true}
+                                      onClick={[Function]}
+                                    >
+                                      <ForwardRef(ButtonBase)
+                                        aria-label="open drawer"
+                                        centerRipple={true}
+                                        className="MuiIconButton-root Header-menuButton-9 Header-hide-10 MuiIconButton-colorInherit"
+                                        classes={
+                                          Object {
+                                            "disabled": "Mui-disabled",
+                                            "focusVisible": "Mui-focusVisible",
+                                            "root": "MuiButtonBase-root",
+                                          }
+                                        }
+                                        disabled={false}
+                                        focusRipple={true}
+                                        onClick={[Function]}
+                                      >
+                                        <button
+                                          aria-label="open drawer"
+                                          className="MuiButtonBase-root MuiIconButton-root Header-menuButton-9 Header-hide-10 MuiIconButton-colorInherit"
+                                          disabled={false}
+                                          onBlur={[Function]}
+                                          onClick={[Function]}
+                                          onFocus={[Function]}
+                                          onKeyDown={[Function]}
+                                          onKeyUp={[Function]}
+                                          onMouseDown={[Function]}
+                                          onMouseLeave={[Function]}
+                                          onMouseUp={[Function]}
+                                          onTouchEnd={[Function]}
+                                          onTouchMove={[Function]}
+                                          onTouchStart={[Function]}
+                                          tabIndex={0}
+                                          type="button"
+                                        >
+                                          <span
+                                            className="MuiIconButton-label"
+                                          >
+                                            <ForwardRef>
+                                              <WithStyles(ForwardRef(SvgIcon))>
+                                                <ForwardRef(SvgIcon)
+                                                  classes={
+                                                    Object {
+                                                      "colorAction": "MuiSvgIcon-colorAction",
+                                                      "colorDisabled": "MuiSvgIcon-colorDisabled",
+                                                      "colorError": "MuiSvgIcon-colorError",
+                                                      "colorPrimary": "MuiSvgIcon-colorPrimary",
+                                                      "colorSecondary": "MuiSvgIcon-colorSecondary",
+                                                      "fontSizeInherit": "MuiSvgIcon-fontSizeInherit",
+                                                      "fontSizeLarge": "MuiSvgIcon-fontSizeLarge",
+                                                      "fontSizeSmall": "MuiSvgIcon-fontSizeSmall",
+                                                      "root": "MuiSvgIcon-root",
+                                                    }
+                                                  }
+                                                >
+                                                  <svg
+                                                    aria-hidden="true"
+                                                    className="MuiSvgIcon-root"
+                                                    focusable="false"
+                                                    role="presentation"
+                                                    viewBox="0 0 24 24"
+                                                  >
+                                                    <path
+                                                      d="M0 0h24v24H0z"
+                                                      fill="none"
+                                                    />
+                                                    <path
+                                                      d="M3 18h18v-2H3v2zm0-5h18v-2H3v2zm0-7v2h18V6H3z"
+                                                    />
+                                                  </svg>
+                                                </ForwardRef(SvgIcon)>
+                                              </WithStyles(ForwardRef(SvgIcon))>
+                                            </ForwardRef>
+                                          </span>
+                                          <NoSsr>
+                                            <WithStyles(TouchRipple)
+                                              center={true}
+                                            >
+                                              <TouchRipple
+                                                center={true}
+                                                classes={
+                                                  Object {
+                                                    "child": "MuiTouchRipple-child",
+                                                    "childLeaving": "MuiTouchRipple-childLeaving",
+                                                    "childPulsate": "MuiTouchRipple-childPulsate",
+                                                    "ripple": "MuiTouchRipple-ripple",
+                                                    "ripplePulsate": "MuiTouchRipple-ripplePulsate",
+                                                    "rippleVisible": "MuiTouchRipple-rippleVisible",
+                                                    "root": "MuiTouchRipple-root",
+                                                  }
+                                                }
+                                              >
+                                                <span
+                                                  className="MuiTouchRipple-root"
+                                                >
+                                                  <TransitionGroup
+                                                    childFactory={[Function]}
+                                                    component={null}
+                                                    enter={true}
+                                                    exit={true}
+                                                  />
+                                                </span>
+                                              </TouchRipple>
+                                            </WithStyles(TouchRipple)>
+                                          </NoSsr>
+                                        </button>
+                                      </ForwardRef(ButtonBase)>
+                                    </WithStyles(ForwardRef(ButtonBase))>
+                                  </ForwardRef(IconButton)>
+                                </WithStyles(ForwardRef(IconButton))>
+                                <WithStyles(ForwardRef(Typography))
+                                  className="Header-flex-11 Header-title-12"
+                                  color="inherit"
+                                  onClick={[Function]}
+                                  variant="h6"
+                                >
+                                  <ForwardRef(Typography)
+                                    className="Header-flex-11 Header-title-12"
+                                    classes={
+                                      Object {
+                                        "alignCenter": "MuiTypography-alignCenter",
+                                        "alignJustify": "MuiTypography-alignJustify",
+                                        "alignLeft": "MuiTypography-alignLeft",
+                                        "alignRight": "MuiTypography-alignRight",
+                                        "body1": "MuiTypography-body1",
+                                        "body2": "MuiTypography-body2",
+                                        "button": "MuiTypography-button",
+                                        "caption": "MuiTypography-caption",
+                                        "colorError": "MuiTypography-colorError",
+                                        "colorInherit": "MuiTypography-colorInherit",
+                                        "colorPrimary": "MuiTypography-colorPrimary",
+                                        "colorSecondary": "MuiTypography-colorSecondary",
+                                        "colorTextPrimary": "MuiTypography-colorTextPrimary",
+                                        "colorTextSecondary": "MuiTypography-colorTextSecondary",
+                                        "displayBlock": "MuiTypography-displayBlock",
+                                        "displayInline": "MuiTypography-displayInline",
+                                        "gutterBottom": "MuiTypography-gutterBottom",
+                                        "h1": "MuiTypography-h1",
+                                        "h2": "MuiTypography-h2",
+                                        "h3": "MuiTypography-h3",
+                                        "h4": "MuiTypography-h4",
+                                        "h5": "MuiTypography-h5",
+                                        "h6": "MuiTypography-h6",
+                                        "noWrap": "MuiTypography-noWrap",
+                                        "overline": "MuiTypography-overline",
+                                        "paragraph": "MuiTypography-paragraph",
+                                        "root": "MuiTypography-root",
+                                        "srOnly": "MuiTypography-srOnly",
+                                        "subtitle1": "MuiTypography-subtitle1",
+                                        "subtitle2": "MuiTypography-subtitle2",
+                                      }
+                                    }
+                                    color="inherit"
+                                    onClick={[Function]}
+                                    theme={
+                                      Object {
+                                        "breakpoints": Object {
+                                          "between": [Function],
+                                          "down": [Function],
+                                          "keys": Array [
+                                            "xs",
+                                            "sm",
+                                            "md",
+                                            "lg",
+                                            "xl",
+                                          ],
+                                          "only": [Function],
+                                          "up": [Function],
+                                          "values": Object {
+                                            "lg": 1280,
+                                            "md": 960,
+                                            "sm": 600,
+                                            "xl": 1920,
+                                            "xs": 0,
+                                          },
+                                          "width": [Function],
+                                        },
+                                        "direction": "ltr",
+                                        "mixins": Object {
+                                          "gutters": [Function],
+                                          "toolbar": Object {
+                                            "@media (min-width:0px) and (orientation: landscape)": Object {
+                                              "minHeight": 48,
+                                            },
+                                            "@media (min-width:600px)": Object {
+                                              "minHeight": 64,
+                                            },
+                                            "minHeight": 56,
+                                          },
+                                        },
+                                        "overrides": Object {},
+                                        "palette": Object {
+                                          "action": Object {
+                                            "active": "rgba(0, 0, 0, 0.54)",
+                                            "disabled": "rgba(0, 0, 0, 0.26)",
+                                            "disabledBackground": "rgba(0, 0, 0, 0.12)",
+                                            "hover": "rgba(0, 0, 0, 0.08)",
+                                            "hoverOpacity": 0.08,
+                                            "selected": "rgba(0, 0, 0, 0.14)",
+                                          },
+                                          "augmentColor": [Function],
+                                          "background": Object {
+                                            "default": "#fafafa",
+                                            "paper": "#fff",
+                                          },
+                                          "common": Object {
+                                            "black": "#000",
+                                            "white": "#fff",
+                                          },
+                                          "contrastThreshold": 3,
+                                          "divider": "rgba(0, 0, 0, 0.12)",
+                                          "error": Object {
+                                            "contrastText": "#fff",
+                                            "dark": "#d32f2f",
+                                            "light": "#e57373",
+                                            "main": "#f44336",
+                                          },
+                                          "getContrastText": [Function],
+                                          "grey": Object {
+                                            "100": "#f5f5f5",
+                                            "200": "#eeeeee",
+                                            "300": "#e0e0e0",
+                                            "400": "#bdbdbd",
+                                            "50": "#fafafa",
+                                            "500": "#9e9e9e",
+                                            "600": "#757575",
+                                            "700": "#616161",
+                                            "800": "#424242",
+                                            "900": "#212121",
+                                            "A100": "#d5d5d5",
+                                            "A200": "#aaaaaa",
+                                            "A400": "#303030",
+                                            "A700": "#616161",
+                                          },
+                                          "primary": Object {
+                                            "contrastText": "#fff",
+                                            "dark": "#303f9f",
+                                            "light": "#7986cb",
+                                            "main": "#3f51b5",
+                                          },
+                                          "secondary": Object {
+                                            "contrastText": "#fff",
+                                            "dark": "#c51162",
+                                            "light": "#ff4081",
+                                            "main": "#f50057",
+                                          },
+                                          "text": Object {
+                                            "disabled": "rgba(0, 0, 0, 0.38)",
+                                            "hint": "rgba(0, 0, 0, 0.38)",
+                                            "primary": "rgba(0, 0, 0, 0.87)",
+                                            "secondary": "rgba(0, 0, 0, 0.54)",
+                                          },
+                                          "tonalOffset": 0.2,
+                                          "type": "light",
+                                        },
+                                        "props": Object {},
+                                        "shadows": Array [
+                                          "none",
+                                          "0px 1px 3px 0px rgba(0,0,0,0.2),0px 1px 1px 0px rgba(0,0,0,0.14),0px 2px 1px -1px rgba(0,0,0,0.12)",
+                                          "0px 1px 5px 0px rgba(0,0,0,0.2),0px 2px 2px 0px rgba(0,0,0,0.14),0px 3px 1px -2px rgba(0,0,0,0.12)",
+                                          "0px 1px 8px 0px rgba(0,0,0,0.2),0px 3px 4px 0px rgba(0,0,0,0.14),0px 3px 3px -2px rgba(0,0,0,0.12)",
+                                          "0px 2px 4px -1px rgba(0,0,0,0.2),0px 4px 5px 0px rgba(0,0,0,0.14),0px 1px 10px 0px rgba(0,0,0,0.12)",
+                                          "0px 3px 5px -1px rgba(0,0,0,0.2),0px 5px 8px 0px rgba(0,0,0,0.14),0px 1px 14px 0px rgba(0,0,0,0.12)",
+                                          "0px 3px 5px -1px rgba(0,0,0,0.2),0px 6px 10px 0px rgba(0,0,0,0.14),0px 1px 18px 0px rgba(0,0,0,0.12)",
+                                          "0px 4px 5px -2px rgba(0,0,0,0.2),0px 7px 10px 1px rgba(0,0,0,0.14),0px 2px 16px 1px rgba(0,0,0,0.12)",
+                                          "0px 5px 5px -3px rgba(0,0,0,0.2),0px 8px 10px 1px rgba(0,0,0,0.14),0px 3px 14px 2px rgba(0,0,0,0.12)",
+                                          "0px 5px 6px -3px rgba(0,0,0,0.2),0px 9px 12px 1px rgba(0,0,0,0.14),0px 3px 16px 2px rgba(0,0,0,0.12)",
+                                          "0px 6px 6px -3px rgba(0,0,0,0.2),0px 10px 14px 1px rgba(0,0,0,0.14),0px 4px 18px 3px rgba(0,0,0,0.12)",
+                                          "0px 6px 7px -4px rgba(0,0,0,0.2),0px 11px 15px 1px rgba(0,0,0,0.14),0px 4px 20px 3px rgba(0,0,0,0.12)",
+                                          "0px 7px 8px -4px rgba(0,0,0,0.2),0px 12px 17px 2px rgba(0,0,0,0.14),0px 5px 22px 4px rgba(0,0,0,0.12)",
+                                          "0px 7px 8px -4px rgba(0,0,0,0.2),0px 13px 19px 2px rgba(0,0,0,0.14),0px 5px 24px 4px rgba(0,0,0,0.12)",
+                                          "0px 7px 9px -4px rgba(0,0,0,0.2),0px 14px 21px 2px rgba(0,0,0,0.14),0px 5px 26px 4px rgba(0,0,0,0.12)",
+                                          "0px 8px 9px -5px rgba(0,0,0,0.2),0px 15px 22px 2px rgba(0,0,0,0.14),0px 6px 28px 5px rgba(0,0,0,0.12)",
+                                          "0px 8px 10px -5px rgba(0,0,0,0.2),0px 16px 24px 2px rgba(0,0,0,0.14),0px 6px 30px 5px rgba(0,0,0,0.12)",
+                                          "0px 8px 11px -5px rgba(0,0,0,0.2),0px 17px 26px 2px rgba(0,0,0,0.14),0px 6px 32px 5px rgba(0,0,0,0.12)",
+                                          "0px 9px 11px -5px rgba(0,0,0,0.2),0px 18px 28px 2px rgba(0,0,0,0.14),0px 7px 34px 6px rgba(0,0,0,0.12)",
+                                          "0px 9px 12px -6px rgba(0,0,0,0.2),0px 19px 29px 2px rgba(0,0,0,0.14),0px 7px 36px 6px rgba(0,0,0,0.12)",
+                                          "0px 10px 13px -6px rgba(0,0,0,0.2),0px 20px 31px 3px rgba(0,0,0,0.14),0px 8px 38px 7px rgba(0,0,0,0.12)",
+                                          "0px 10px 13px -6px rgba(0,0,0,0.2),0px 21px 33px 3px rgba(0,0,0,0.14),0px 8px 40px 7px rgba(0,0,0,0.12)",
+                                          "0px 10px 14px -6px rgba(0,0,0,0.2),0px 22px 35px 3px rgba(0,0,0,0.14),0px 8px 42px 7px rgba(0,0,0,0.12)",
+                                          "0px 11px 14px -7px rgba(0,0,0,0.2),0px 23px 36px 3px rgba(0,0,0,0.14),0px 9px 44px 8px rgba(0,0,0,0.12)",
+                                          "0px 11px 15px -7px rgba(0,0,0,0.2),0px 24px 38px 3px rgba(0,0,0,0.14),0px 9px 46px 8px rgba(0,0,0,0.12)",
+                                        ],
+                                        "shape": Object {
+                                          "borderRadius": 4,
+                                        },
+                                        "spacing": [Function],
+                                        "transitions": Object {
+                                          "create": [Function],
+                                          "duration": Object {
+                                            "complex": 375,
+                                            "enteringScreen": 225,
+                                            "leavingScreen": 195,
+                                            "short": 250,
+                                            "shorter": 200,
+                                            "shortest": 150,
+                                            "standard": 300,
+                                          },
+                                          "easing": Object {
+                                            "easeIn": "cubic-bezier(0.4, 0, 1, 1)",
+                                            "easeInOut": "cubic-bezier(0.4, 0, 0.2, 1)",
+                                            "easeOut": "cubic-bezier(0.0, 0, 0.2, 1)",
+                                            "sharp": "cubic-bezier(0.4, 0, 0.6, 1)",
+                                          },
+                                          "getAutoHeightDuration": [Function],
+                                        },
+                                        "typography": Object {
+                                          "body1": Object {
+                                            "fontFamily": "\\"Roboto\\", \\"Helvetica\\", \\"Arial\\", sans-serif",
+                                            "fontSize": "1rem",
+                                            "fontWeight": 400,
+                                            "letterSpacing": "0.00938em",
+                                            "lineHeight": 1.5,
+                                          },
+                                          "body2": Object {
+                                            "fontFamily": "\\"Roboto\\", \\"Helvetica\\", \\"Arial\\", sans-serif",
+                                            "fontSize": "0.875rem",
+                                            "fontWeight": 400,
+                                            "letterSpacing": "0.01071em",
+                                            "lineHeight": 1.43,
+                                          },
+                                          "button": Object {
+                                            "fontFamily": "\\"Roboto\\", \\"Helvetica\\", \\"Arial\\", sans-serif",
+                                            "fontSize": "0.875rem",
+                                            "fontWeight": 500,
+                                            "letterSpacing": "0.02857em",
+                                            "lineHeight": 1.75,
+                                            "textTransform": "uppercase",
+                                          },
+                                          "caption": Object {
+                                            "fontFamily": "\\"Roboto\\", \\"Helvetica\\", \\"Arial\\", sans-serif",
+                                            "fontSize": "0.75rem",
+                                            "fontWeight": 400,
+                                            "letterSpacing": "0.03333em",
+                                            "lineHeight": 1.66,
+                                          },
+                                          "fontFamily": "\\"Roboto\\", \\"Helvetica\\", \\"Arial\\", sans-serif",
+                                          "fontSize": 14,
+                                          "fontWeightBold": 700,
+                                          "fontWeightLight": 300,
+                                          "fontWeightMedium": 500,
+                                          "fontWeightRegular": 400,
+                                          "h1": Object {
+                                            "fontFamily": "\\"Roboto\\", \\"Helvetica\\", \\"Arial\\", sans-serif",
+                                            "fontSize": "6rem",
+                                            "fontWeight": 300,
+                                            "letterSpacing": "-0.01562em",
+                                            "lineHeight": 1,
+                                          },
+                                          "h2": Object {
+                                            "fontFamily": "\\"Roboto\\", \\"Helvetica\\", \\"Arial\\", sans-serif",
+                                            "fontSize": "3.75rem",
+                                            "fontWeight": 300,
+                                            "letterSpacing": "-0.00833em",
+                                            "lineHeight": 1,
+                                          },
+                                          "h3": Object {
+                                            "fontFamily": "\\"Roboto\\", \\"Helvetica\\", \\"Arial\\", sans-serif",
+                                            "fontSize": "3rem",
+                                            "fontWeight": 400,
+                                            "letterSpacing": "0em",
+                                            "lineHeight": 1.04,
+                                          },
+                                          "h4": Object {
+                                            "fontFamily": "\\"Roboto\\", \\"Helvetica\\", \\"Arial\\", sans-serif",
+                                            "fontSize": "2.125rem",
+                                            "fontWeight": 400,
+                                            "letterSpacing": "0.00735em",
+                                            "lineHeight": 1.17,
+                                          },
+                                          "h5": Object {
+                                            "fontFamily": "\\"Roboto\\", \\"Helvetica\\", \\"Arial\\", sans-serif",
+                                            "fontSize": "1.5rem",
+                                            "fontWeight": 400,
+                                            "letterSpacing": "0em",
+                                            "lineHeight": 1.33,
+                                          },
+                                          "h6": Object {
+                                            "fontFamily": "\\"Roboto\\", \\"Helvetica\\", \\"Arial\\", sans-serif",
+                                            "fontSize": "1.25rem",
+                                            "fontWeight": 500,
+                                            "letterSpacing": "0.0075em",
+                                            "lineHeight": 1.6,
+                                          },
+                                          "htmlFontSize": 16,
+                                          "overline": Object {
+                                            "fontFamily": "\\"Roboto\\", \\"Helvetica\\", \\"Arial\\", sans-serif",
+                                            "fontSize": "0.75rem",
+                                            "fontWeight": 400,
+                                            "letterSpacing": "0.08333em",
+                                            "lineHeight": 2.66,
+                                            "textTransform": "uppercase",
+                                          },
+                                          "pxToRem": [Function],
+                                          "round": [Function],
+                                          "subtitle1": Object {
+                                            "fontFamily": "\\"Roboto\\", \\"Helvetica\\", \\"Arial\\", sans-serif",
+                                            "fontSize": "1rem",
+                                            "fontWeight": 400,
+                                            "letterSpacing": "0.00938em",
+                                            "lineHeight": 1.75,
+                                          },
+                                          "subtitle2": Object {
+                                            "fontFamily": "\\"Roboto\\", \\"Helvetica\\", \\"Arial\\", sans-serif",
+                                            "fontSize": "0.875rem",
+                                            "fontWeight": 500,
+                                            "letterSpacing": "0.00714em",
+                                            "lineHeight": 1.57,
+                                          },
+                                        },
+                                        "zIndex": Object {
+                                          "appBar": 1100,
+                                          "drawer": 1200,
+                                          "mobileStepper": 1000,
+                                          "modal": 1300,
+                                          "snackbar": 1400,
+                                          "tooltip": 1500,
+                                        },
+                                      }
+                                    }
+                                    variant="h6"
+                                  >
+                                    <h6
+                                      className="MuiTypography-root Header-flex-11 Header-title-12 MuiTypography-h6 MuiTypography-colorInherit"
+                                      onClick={[Function]}
+                                    >
+                                      Foo
+                                    </h6>
+                                  </ForwardRef(Typography)>
+                                </WithStyles(ForwardRef(Typography))>
+                              </div>
+                            </ForwardRef(Toolbar)>
+                          </WithStyles(ForwardRef(Toolbar))>
+                        </header>
+                      </ForwardRef(Paper)>
+                    </WithStyles(ForwardRef(Paper))>
+                  </ForwardRef(AppBar)>
+                </WithStyles(ForwardRef(AppBar))>
               </div>
-              <div
-                className="MuiButtonBase-root-58 MuiListItem-root-123 MuiListItem-default-126 MuiListItem-gutters-130 MuiListItem-button-131 MenuItem-isDisabled-122"
-                onBlur={[Function]}
-                onClick={[Function]}
-                onFocus={[Function]}
-                onKeyDown={[Function]}
-                onKeyUp={[Function]}
-                onMouseDown={[Function]}
-                onMouseLeave={[Function]}
-                onMouseUp={[Function]}
-                onTouchEnd={[Function]}
-                onTouchMove={[Function]}
-                onTouchStart={[Function]}
-                role="button"
-                tabIndex="0"
+            </Header>
+          </WithStyles(Header)>
+          <div
+            className="BaseBranch-appFrame-1"
+          >
+            <WithStyles(Drawer)
+              data={
+                Array [
+                  Object {
+                    "icon": null,
+                    "title": "Dashboard",
+                    "type": "link",
+                    "url": "/",
+                  },
+                  Object {
+                    "isDisabled": true,
+                    "title": "New portfolio",
+                    "type": "link",
+                    "url": "/portfolio",
+                  },
+                  Object {
+                    "type": "divider",
+                  },
+                  Object {
+                    "icon": Object {
+                      "$$typeof": Symbol(react.memo),
+                      "compare": null,
+                      "displayName": "BugReportIcon",
+                      "muiName": "SvgIcon",
+                      "type": Object {
+                        "$$typeof": Symbol(react.forward_ref),
+                        "render": [Function],
+                      },
+                    },
+                    "title": "Report a bug",
+                    "type": "link",
+                    "url": "/bug",
+                  },
+                ]
+              }
+              isOpen={true}
+              onClose={[Function]}
+              redirectTo={[Function]}
+            >
+              <Drawer
+                classes={
+                  Object {
+                    "drawerHeader": "Drawer-drawerHeader-105",
+                    "drawerPaper": "Drawer-drawerPaper-104",
+                  }
+                }
+                data={
+                  Array [
+                    Object {
+                      "icon": null,
+                      "title": "Dashboard",
+                      "type": "link",
+                      "url": "/",
+                    },
+                    Object {
+                      "isDisabled": true,
+                      "title": "New portfolio",
+                      "type": "link",
+                      "url": "/portfolio",
+                    },
+                    Object {
+                      "type": "divider",
+                    },
+                    Object {
+                      "icon": Object {
+                        "$$typeof": Symbol(react.memo),
+                        "compare": null,
+                        "displayName": "BugReportIcon",
+                        "muiName": "SvgIcon",
+                        "type": Object {
+                          "$$typeof": Symbol(react.forward_ref),
+                          "render": [Function],
+                        },
+                      },
+                      "title": "Report a bug",
+                      "type": "link",
+                      "url": "/bug",
+                    },
+                  ]
+                }
+                isOpen={true}
+                onClose={[Function]}
+                redirectTo={[Function]}
               >
-                <div
-                  className="MuiListItemText-root-134"
+                <WithStyles(ForwardRef(Drawer))
+                  anchor="left"
+                  classes={
+                    Object {
+                      "paper": "Drawer-drawerPaper-104",
+                    }
+                  }
+                  open={true}
+                  variant="persistent"
                 >
-                  <span
-                    className="MuiTypography-root-75 MuiTypography-subheading-82 MuiListItemText-primary-137"
+                  <ForwardRef(Drawer)
+                    anchor="left"
+                    classes={
+                      Object {
+                        "docked": "MuiDrawer-docked",
+                        "modal": "MuiDrawer-modal",
+                        "paper": "MuiDrawer-paper Drawer-drawerPaper-104",
+                        "paperAnchorBottom": "MuiDrawer-paperAnchorBottom",
+                        "paperAnchorDockedBottom": "MuiDrawer-paperAnchorDockedBottom",
+                        "paperAnchorDockedLeft": "MuiDrawer-paperAnchorDockedLeft",
+                        "paperAnchorDockedRight": "MuiDrawer-paperAnchorDockedRight",
+                        "paperAnchorDockedTop": "MuiDrawer-paperAnchorDockedTop",
+                        "paperAnchorLeft": "MuiDrawer-paperAnchorLeft",
+                        "paperAnchorRight": "MuiDrawer-paperAnchorRight",
+                        "paperAnchorTop": "MuiDrawer-paperAnchorTop",
+                        "root": "MuiDrawer-root",
+                      }
+                    }
+                    open={true}
+                    theme={
+                      Object {
+                        "breakpoints": Object {
+                          "between": [Function],
+                          "down": [Function],
+                          "keys": Array [
+                            "xs",
+                            "sm",
+                            "md",
+                            "lg",
+                            "xl",
+                          ],
+                          "only": [Function],
+                          "up": [Function],
+                          "values": Object {
+                            "lg": 1280,
+                            "md": 960,
+                            "sm": 600,
+                            "xl": 1920,
+                            "xs": 0,
+                          },
+                          "width": [Function],
+                        },
+                        "direction": "ltr",
+                        "mixins": Object {
+                          "gutters": [Function],
+                          "toolbar": Object {
+                            "@media (min-width:0px) and (orientation: landscape)": Object {
+                              "minHeight": 48,
+                            },
+                            "@media (min-width:600px)": Object {
+                              "minHeight": 64,
+                            },
+                            "minHeight": 56,
+                          },
+                        },
+                        "overrides": Object {},
+                        "palette": Object {
+                          "action": Object {
+                            "active": "rgba(0, 0, 0, 0.54)",
+                            "disabled": "rgba(0, 0, 0, 0.26)",
+                            "disabledBackground": "rgba(0, 0, 0, 0.12)",
+                            "hover": "rgba(0, 0, 0, 0.08)",
+                            "hoverOpacity": 0.08,
+                            "selected": "rgba(0, 0, 0, 0.14)",
+                          },
+                          "augmentColor": [Function],
+                          "background": Object {
+                            "default": "#fafafa",
+                            "paper": "#fff",
+                          },
+                          "common": Object {
+                            "black": "#000",
+                            "white": "#fff",
+                          },
+                          "contrastThreshold": 3,
+                          "divider": "rgba(0, 0, 0, 0.12)",
+                          "error": Object {
+                            "contrastText": "#fff",
+                            "dark": "#d32f2f",
+                            "light": "#e57373",
+                            "main": "#f44336",
+                          },
+                          "getContrastText": [Function],
+                          "grey": Object {
+                            "100": "#f5f5f5",
+                            "200": "#eeeeee",
+                            "300": "#e0e0e0",
+                            "400": "#bdbdbd",
+                            "50": "#fafafa",
+                            "500": "#9e9e9e",
+                            "600": "#757575",
+                            "700": "#616161",
+                            "800": "#424242",
+                            "900": "#212121",
+                            "A100": "#d5d5d5",
+                            "A200": "#aaaaaa",
+                            "A400": "#303030",
+                            "A700": "#616161",
+                          },
+                          "primary": Object {
+                            "contrastText": "#fff",
+                            "dark": "#303f9f",
+                            "light": "#7986cb",
+                            "main": "#3f51b5",
+                          },
+                          "secondary": Object {
+                            "contrastText": "#fff",
+                            "dark": "#c51162",
+                            "light": "#ff4081",
+                            "main": "#f50057",
+                          },
+                          "text": Object {
+                            "disabled": "rgba(0, 0, 0, 0.38)",
+                            "hint": "rgba(0, 0, 0, 0.38)",
+                            "primary": "rgba(0, 0, 0, 0.87)",
+                            "secondary": "rgba(0, 0, 0, 0.54)",
+                          },
+                          "tonalOffset": 0.2,
+                          "type": "light",
+                        },
+                        "props": Object {},
+                        "shadows": Array [
+                          "none",
+                          "0px 1px 3px 0px rgba(0,0,0,0.2),0px 1px 1px 0px rgba(0,0,0,0.14),0px 2px 1px -1px rgba(0,0,0,0.12)",
+                          "0px 1px 5px 0px rgba(0,0,0,0.2),0px 2px 2px 0px rgba(0,0,0,0.14),0px 3px 1px -2px rgba(0,0,0,0.12)",
+                          "0px 1px 8px 0px rgba(0,0,0,0.2),0px 3px 4px 0px rgba(0,0,0,0.14),0px 3px 3px -2px rgba(0,0,0,0.12)",
+                          "0px 2px 4px -1px rgba(0,0,0,0.2),0px 4px 5px 0px rgba(0,0,0,0.14),0px 1px 10px 0px rgba(0,0,0,0.12)",
+                          "0px 3px 5px -1px rgba(0,0,0,0.2),0px 5px 8px 0px rgba(0,0,0,0.14),0px 1px 14px 0px rgba(0,0,0,0.12)",
+                          "0px 3px 5px -1px rgba(0,0,0,0.2),0px 6px 10px 0px rgba(0,0,0,0.14),0px 1px 18px 0px rgba(0,0,0,0.12)",
+                          "0px 4px 5px -2px rgba(0,0,0,0.2),0px 7px 10px 1px rgba(0,0,0,0.14),0px 2px 16px 1px rgba(0,0,0,0.12)",
+                          "0px 5px 5px -3px rgba(0,0,0,0.2),0px 8px 10px 1px rgba(0,0,0,0.14),0px 3px 14px 2px rgba(0,0,0,0.12)",
+                          "0px 5px 6px -3px rgba(0,0,0,0.2),0px 9px 12px 1px rgba(0,0,0,0.14),0px 3px 16px 2px rgba(0,0,0,0.12)",
+                          "0px 6px 6px -3px rgba(0,0,0,0.2),0px 10px 14px 1px rgba(0,0,0,0.14),0px 4px 18px 3px rgba(0,0,0,0.12)",
+                          "0px 6px 7px -4px rgba(0,0,0,0.2),0px 11px 15px 1px rgba(0,0,0,0.14),0px 4px 20px 3px rgba(0,0,0,0.12)",
+                          "0px 7px 8px -4px rgba(0,0,0,0.2),0px 12px 17px 2px rgba(0,0,0,0.14),0px 5px 22px 4px rgba(0,0,0,0.12)",
+                          "0px 7px 8px -4px rgba(0,0,0,0.2),0px 13px 19px 2px rgba(0,0,0,0.14),0px 5px 24px 4px rgba(0,0,0,0.12)",
+                          "0px 7px 9px -4px rgba(0,0,0,0.2),0px 14px 21px 2px rgba(0,0,0,0.14),0px 5px 26px 4px rgba(0,0,0,0.12)",
+                          "0px 8px 9px -5px rgba(0,0,0,0.2),0px 15px 22px 2px rgba(0,0,0,0.14),0px 6px 28px 5px rgba(0,0,0,0.12)",
+                          "0px 8px 10px -5px rgba(0,0,0,0.2),0px 16px 24px 2px rgba(0,0,0,0.14),0px 6px 30px 5px rgba(0,0,0,0.12)",
+                          "0px 8px 11px -5px rgba(0,0,0,0.2),0px 17px 26px 2px rgba(0,0,0,0.14),0px 6px 32px 5px rgba(0,0,0,0.12)",
+                          "0px 9px 11px -5px rgba(0,0,0,0.2),0px 18px 28px 2px rgba(0,0,0,0.14),0px 7px 34px 6px rgba(0,0,0,0.12)",
+                          "0px 9px 12px -6px rgba(0,0,0,0.2),0px 19px 29px 2px rgba(0,0,0,0.14),0px 7px 36px 6px rgba(0,0,0,0.12)",
+                          "0px 10px 13px -6px rgba(0,0,0,0.2),0px 20px 31px 3px rgba(0,0,0,0.14),0px 8px 38px 7px rgba(0,0,0,0.12)",
+                          "0px 10px 13px -6px rgba(0,0,0,0.2),0px 21px 33px 3px rgba(0,0,0,0.14),0px 8px 40px 7px rgba(0,0,0,0.12)",
+                          "0px 10px 14px -6px rgba(0,0,0,0.2),0px 22px 35px 3px rgba(0,0,0,0.14),0px 8px 42px 7px rgba(0,0,0,0.12)",
+                          "0px 11px 14px -7px rgba(0,0,0,0.2),0px 23px 36px 3px rgba(0,0,0,0.14),0px 9px 44px 8px rgba(0,0,0,0.12)",
+                          "0px 11px 15px -7px rgba(0,0,0,0.2),0px 24px 38px 3px rgba(0,0,0,0.14),0px 9px 46px 8px rgba(0,0,0,0.12)",
+                        ],
+                        "shape": Object {
+                          "borderRadius": 4,
+                        },
+                        "spacing": [Function],
+                        "transitions": Object {
+                          "create": [Function],
+                          "duration": Object {
+                            "complex": 375,
+                            "enteringScreen": 225,
+                            "leavingScreen": 195,
+                            "short": 250,
+                            "shorter": 200,
+                            "shortest": 150,
+                            "standard": 300,
+                          },
+                          "easing": Object {
+                            "easeIn": "cubic-bezier(0.4, 0, 1, 1)",
+                            "easeInOut": "cubic-bezier(0.4, 0, 0.2, 1)",
+                            "easeOut": "cubic-bezier(0.0, 0, 0.2, 1)",
+                            "sharp": "cubic-bezier(0.4, 0, 0.6, 1)",
+                          },
+                          "getAutoHeightDuration": [Function],
+                        },
+                        "typography": Object {
+                          "body1": Object {
+                            "fontFamily": "\\"Roboto\\", \\"Helvetica\\", \\"Arial\\", sans-serif",
+                            "fontSize": "1rem",
+                            "fontWeight": 400,
+                            "letterSpacing": "0.00938em",
+                            "lineHeight": 1.5,
+                          },
+                          "body2": Object {
+                            "fontFamily": "\\"Roboto\\", \\"Helvetica\\", \\"Arial\\", sans-serif",
+                            "fontSize": "0.875rem",
+                            "fontWeight": 400,
+                            "letterSpacing": "0.01071em",
+                            "lineHeight": 1.43,
+                          },
+                          "button": Object {
+                            "fontFamily": "\\"Roboto\\", \\"Helvetica\\", \\"Arial\\", sans-serif",
+                            "fontSize": "0.875rem",
+                            "fontWeight": 500,
+                            "letterSpacing": "0.02857em",
+                            "lineHeight": 1.75,
+                            "textTransform": "uppercase",
+                          },
+                          "caption": Object {
+                            "fontFamily": "\\"Roboto\\", \\"Helvetica\\", \\"Arial\\", sans-serif",
+                            "fontSize": "0.75rem",
+                            "fontWeight": 400,
+                            "letterSpacing": "0.03333em",
+                            "lineHeight": 1.66,
+                          },
+                          "fontFamily": "\\"Roboto\\", \\"Helvetica\\", \\"Arial\\", sans-serif",
+                          "fontSize": 14,
+                          "fontWeightBold": 700,
+                          "fontWeightLight": 300,
+                          "fontWeightMedium": 500,
+                          "fontWeightRegular": 400,
+                          "h1": Object {
+                            "fontFamily": "\\"Roboto\\", \\"Helvetica\\", \\"Arial\\", sans-serif",
+                            "fontSize": "6rem",
+                            "fontWeight": 300,
+                            "letterSpacing": "-0.01562em",
+                            "lineHeight": 1,
+                          },
+                          "h2": Object {
+                            "fontFamily": "\\"Roboto\\", \\"Helvetica\\", \\"Arial\\", sans-serif",
+                            "fontSize": "3.75rem",
+                            "fontWeight": 300,
+                            "letterSpacing": "-0.00833em",
+                            "lineHeight": 1,
+                          },
+                          "h3": Object {
+                            "fontFamily": "\\"Roboto\\", \\"Helvetica\\", \\"Arial\\", sans-serif",
+                            "fontSize": "3rem",
+                            "fontWeight": 400,
+                            "letterSpacing": "0em",
+                            "lineHeight": 1.04,
+                          },
+                          "h4": Object {
+                            "fontFamily": "\\"Roboto\\", \\"Helvetica\\", \\"Arial\\", sans-serif",
+                            "fontSize": "2.125rem",
+                            "fontWeight": 400,
+                            "letterSpacing": "0.00735em",
+                            "lineHeight": 1.17,
+                          },
+                          "h5": Object {
+                            "fontFamily": "\\"Roboto\\", \\"Helvetica\\", \\"Arial\\", sans-serif",
+                            "fontSize": "1.5rem",
+                            "fontWeight": 400,
+                            "letterSpacing": "0em",
+                            "lineHeight": 1.33,
+                          },
+                          "h6": Object {
+                            "fontFamily": "\\"Roboto\\", \\"Helvetica\\", \\"Arial\\", sans-serif",
+                            "fontSize": "1.25rem",
+                            "fontWeight": 500,
+                            "letterSpacing": "0.0075em",
+                            "lineHeight": 1.6,
+                          },
+                          "htmlFontSize": 16,
+                          "overline": Object {
+                            "fontFamily": "\\"Roboto\\", \\"Helvetica\\", \\"Arial\\", sans-serif",
+                            "fontSize": "0.75rem",
+                            "fontWeight": 400,
+                            "letterSpacing": "0.08333em",
+                            "lineHeight": 2.66,
+                            "textTransform": "uppercase",
+                          },
+                          "pxToRem": [Function],
+                          "round": [Function],
+                          "subtitle1": Object {
+                            "fontFamily": "\\"Roboto\\", \\"Helvetica\\", \\"Arial\\", sans-serif",
+                            "fontSize": "1rem",
+                            "fontWeight": 400,
+                            "letterSpacing": "0.00938em",
+                            "lineHeight": 1.75,
+                          },
+                          "subtitle2": Object {
+                            "fontFamily": "\\"Roboto\\", \\"Helvetica\\", \\"Arial\\", sans-serif",
+                            "fontSize": "0.875rem",
+                            "fontWeight": 500,
+                            "letterSpacing": "0.00714em",
+                            "lineHeight": 1.57,
+                          },
+                        },
+                        "zIndex": Object {
+                          "appBar": 1100,
+                          "drawer": 1200,
+                          "mobileStepper": 1000,
+                          "modal": 1300,
+                          "snackbar": 1400,
+                          "tooltip": 1500,
+                        },
+                      }
+                    }
+                    variant="persistent"
                   >
-                    New portfolio
-                  </span>
-                </div>
-                <span
-                  className="MuiTouchRipple-root-68"
-                />
+                    <div
+                      className="MuiDrawer-root MuiDrawer-docked"
+                    >
+                      <WithTheme(ForwardRef(Slide))
+                        appear={true}
+                        direction="right"
+                        in={true}
+                        timeout={
+                          Object {
+                            "enter": 225,
+                            "exit": 195,
+                          }
+                        }
+                      >
+                        <ForwardRef(Slide)
+                          appear={true}
+                          direction="right"
+                          in={true}
+                          theme={
+                            Object {
+                              "breakpoints": Object {
+                                "between": [Function],
+                                "down": [Function],
+                                "keys": Array [
+                                  "xs",
+                                  "sm",
+                                  "md",
+                                  "lg",
+                                  "xl",
+                                ],
+                                "only": [Function],
+                                "up": [Function],
+                                "values": Object {
+                                  "lg": 1280,
+                                  "md": 960,
+                                  "sm": 600,
+                                  "xl": 1920,
+                                  "xs": 0,
+                                },
+                                "width": [Function],
+                              },
+                              "direction": "ltr",
+                              "mixins": Object {
+                                "gutters": [Function],
+                                "toolbar": Object {
+                                  "@media (min-width:0px) and (orientation: landscape)": Object {
+                                    "minHeight": 48,
+                                  },
+                                  "@media (min-width:600px)": Object {
+                                    "minHeight": 64,
+                                  },
+                                  "minHeight": 56,
+                                },
+                              },
+                              "overrides": Object {},
+                              "palette": Object {
+                                "action": Object {
+                                  "active": "rgba(0, 0, 0, 0.54)",
+                                  "disabled": "rgba(0, 0, 0, 0.26)",
+                                  "disabledBackground": "rgba(0, 0, 0, 0.12)",
+                                  "hover": "rgba(0, 0, 0, 0.08)",
+                                  "hoverOpacity": 0.08,
+                                  "selected": "rgba(0, 0, 0, 0.14)",
+                                },
+                                "augmentColor": [Function],
+                                "background": Object {
+                                  "default": "#fafafa",
+                                  "paper": "#fff",
+                                },
+                                "common": Object {
+                                  "black": "#000",
+                                  "white": "#fff",
+                                },
+                                "contrastThreshold": 3,
+                                "divider": "rgba(0, 0, 0, 0.12)",
+                                "error": Object {
+                                  "contrastText": "#fff",
+                                  "dark": "#d32f2f",
+                                  "light": "#e57373",
+                                  "main": "#f44336",
+                                },
+                                "getContrastText": [Function],
+                                "grey": Object {
+                                  "100": "#f5f5f5",
+                                  "200": "#eeeeee",
+                                  "300": "#e0e0e0",
+                                  "400": "#bdbdbd",
+                                  "50": "#fafafa",
+                                  "500": "#9e9e9e",
+                                  "600": "#757575",
+                                  "700": "#616161",
+                                  "800": "#424242",
+                                  "900": "#212121",
+                                  "A100": "#d5d5d5",
+                                  "A200": "#aaaaaa",
+                                  "A400": "#303030",
+                                  "A700": "#616161",
+                                },
+                                "primary": Object {
+                                  "contrastText": "#fff",
+                                  "dark": "#303f9f",
+                                  "light": "#7986cb",
+                                  "main": "#3f51b5",
+                                },
+                                "secondary": Object {
+                                  "contrastText": "#fff",
+                                  "dark": "#c51162",
+                                  "light": "#ff4081",
+                                  "main": "#f50057",
+                                },
+                                "text": Object {
+                                  "disabled": "rgba(0, 0, 0, 0.38)",
+                                  "hint": "rgba(0, 0, 0, 0.38)",
+                                  "primary": "rgba(0, 0, 0, 0.87)",
+                                  "secondary": "rgba(0, 0, 0, 0.54)",
+                                },
+                                "tonalOffset": 0.2,
+                                "type": "light",
+                              },
+                              "props": Object {},
+                              "shadows": Array [
+                                "none",
+                                "0px 1px 3px 0px rgba(0,0,0,0.2),0px 1px 1px 0px rgba(0,0,0,0.14),0px 2px 1px -1px rgba(0,0,0,0.12)",
+                                "0px 1px 5px 0px rgba(0,0,0,0.2),0px 2px 2px 0px rgba(0,0,0,0.14),0px 3px 1px -2px rgba(0,0,0,0.12)",
+                                "0px 1px 8px 0px rgba(0,0,0,0.2),0px 3px 4px 0px rgba(0,0,0,0.14),0px 3px 3px -2px rgba(0,0,0,0.12)",
+                                "0px 2px 4px -1px rgba(0,0,0,0.2),0px 4px 5px 0px rgba(0,0,0,0.14),0px 1px 10px 0px rgba(0,0,0,0.12)",
+                                "0px 3px 5px -1px rgba(0,0,0,0.2),0px 5px 8px 0px rgba(0,0,0,0.14),0px 1px 14px 0px rgba(0,0,0,0.12)",
+                                "0px 3px 5px -1px rgba(0,0,0,0.2),0px 6px 10px 0px rgba(0,0,0,0.14),0px 1px 18px 0px rgba(0,0,0,0.12)",
+                                "0px 4px 5px -2px rgba(0,0,0,0.2),0px 7px 10px 1px rgba(0,0,0,0.14),0px 2px 16px 1px rgba(0,0,0,0.12)",
+                                "0px 5px 5px -3px rgba(0,0,0,0.2),0px 8px 10px 1px rgba(0,0,0,0.14),0px 3px 14px 2px rgba(0,0,0,0.12)",
+                                "0px 5px 6px -3px rgba(0,0,0,0.2),0px 9px 12px 1px rgba(0,0,0,0.14),0px 3px 16px 2px rgba(0,0,0,0.12)",
+                                "0px 6px 6px -3px rgba(0,0,0,0.2),0px 10px 14px 1px rgba(0,0,0,0.14),0px 4px 18px 3px rgba(0,0,0,0.12)",
+                                "0px 6px 7px -4px rgba(0,0,0,0.2),0px 11px 15px 1px rgba(0,0,0,0.14),0px 4px 20px 3px rgba(0,0,0,0.12)",
+                                "0px 7px 8px -4px rgba(0,0,0,0.2),0px 12px 17px 2px rgba(0,0,0,0.14),0px 5px 22px 4px rgba(0,0,0,0.12)",
+                                "0px 7px 8px -4px rgba(0,0,0,0.2),0px 13px 19px 2px rgba(0,0,0,0.14),0px 5px 24px 4px rgba(0,0,0,0.12)",
+                                "0px 7px 9px -4px rgba(0,0,0,0.2),0px 14px 21px 2px rgba(0,0,0,0.14),0px 5px 26px 4px rgba(0,0,0,0.12)",
+                                "0px 8px 9px -5px rgba(0,0,0,0.2),0px 15px 22px 2px rgba(0,0,0,0.14),0px 6px 28px 5px rgba(0,0,0,0.12)",
+                                "0px 8px 10px -5px rgba(0,0,0,0.2),0px 16px 24px 2px rgba(0,0,0,0.14),0px 6px 30px 5px rgba(0,0,0,0.12)",
+                                "0px 8px 11px -5px rgba(0,0,0,0.2),0px 17px 26px 2px rgba(0,0,0,0.14),0px 6px 32px 5px rgba(0,0,0,0.12)",
+                                "0px 9px 11px -5px rgba(0,0,0,0.2),0px 18px 28px 2px rgba(0,0,0,0.14),0px 7px 34px 6px rgba(0,0,0,0.12)",
+                                "0px 9px 12px -6px rgba(0,0,0,0.2),0px 19px 29px 2px rgba(0,0,0,0.14),0px 7px 36px 6px rgba(0,0,0,0.12)",
+                                "0px 10px 13px -6px rgba(0,0,0,0.2),0px 20px 31px 3px rgba(0,0,0,0.14),0px 8px 38px 7px rgba(0,0,0,0.12)",
+                                "0px 10px 13px -6px rgba(0,0,0,0.2),0px 21px 33px 3px rgba(0,0,0,0.14),0px 8px 40px 7px rgba(0,0,0,0.12)",
+                                "0px 10px 14px -6px rgba(0,0,0,0.2),0px 22px 35px 3px rgba(0,0,0,0.14),0px 8px 42px 7px rgba(0,0,0,0.12)",
+                                "0px 11px 14px -7px rgba(0,0,0,0.2),0px 23px 36px 3px rgba(0,0,0,0.14),0px 9px 44px 8px rgba(0,0,0,0.12)",
+                                "0px 11px 15px -7px rgba(0,0,0,0.2),0px 24px 38px 3px rgba(0,0,0,0.14),0px 9px 46px 8px rgba(0,0,0,0.12)",
+                              ],
+                              "shape": Object {
+                                "borderRadius": 4,
+                              },
+                              "spacing": [Function],
+                              "transitions": Object {
+                                "create": [Function],
+                                "duration": Object {
+                                  "complex": 375,
+                                  "enteringScreen": 225,
+                                  "leavingScreen": 195,
+                                  "short": 250,
+                                  "shorter": 200,
+                                  "shortest": 150,
+                                  "standard": 300,
+                                },
+                                "easing": Object {
+                                  "easeIn": "cubic-bezier(0.4, 0, 1, 1)",
+                                  "easeInOut": "cubic-bezier(0.4, 0, 0.2, 1)",
+                                  "easeOut": "cubic-bezier(0.0, 0, 0.2, 1)",
+                                  "sharp": "cubic-bezier(0.4, 0, 0.6, 1)",
+                                },
+                                "getAutoHeightDuration": [Function],
+                              },
+                              "typography": Object {
+                                "body1": Object {
+                                  "fontFamily": "\\"Roboto\\", \\"Helvetica\\", \\"Arial\\", sans-serif",
+                                  "fontSize": "1rem",
+                                  "fontWeight": 400,
+                                  "letterSpacing": "0.00938em",
+                                  "lineHeight": 1.5,
+                                },
+                                "body2": Object {
+                                  "fontFamily": "\\"Roboto\\", \\"Helvetica\\", \\"Arial\\", sans-serif",
+                                  "fontSize": "0.875rem",
+                                  "fontWeight": 400,
+                                  "letterSpacing": "0.01071em",
+                                  "lineHeight": 1.43,
+                                },
+                                "button": Object {
+                                  "fontFamily": "\\"Roboto\\", \\"Helvetica\\", \\"Arial\\", sans-serif",
+                                  "fontSize": "0.875rem",
+                                  "fontWeight": 500,
+                                  "letterSpacing": "0.02857em",
+                                  "lineHeight": 1.75,
+                                  "textTransform": "uppercase",
+                                },
+                                "caption": Object {
+                                  "fontFamily": "\\"Roboto\\", \\"Helvetica\\", \\"Arial\\", sans-serif",
+                                  "fontSize": "0.75rem",
+                                  "fontWeight": 400,
+                                  "letterSpacing": "0.03333em",
+                                  "lineHeight": 1.66,
+                                },
+                                "fontFamily": "\\"Roboto\\", \\"Helvetica\\", \\"Arial\\", sans-serif",
+                                "fontSize": 14,
+                                "fontWeightBold": 700,
+                                "fontWeightLight": 300,
+                                "fontWeightMedium": 500,
+                                "fontWeightRegular": 400,
+                                "h1": Object {
+                                  "fontFamily": "\\"Roboto\\", \\"Helvetica\\", \\"Arial\\", sans-serif",
+                                  "fontSize": "6rem",
+                                  "fontWeight": 300,
+                                  "letterSpacing": "-0.01562em",
+                                  "lineHeight": 1,
+                                },
+                                "h2": Object {
+                                  "fontFamily": "\\"Roboto\\", \\"Helvetica\\", \\"Arial\\", sans-serif",
+                                  "fontSize": "3.75rem",
+                                  "fontWeight": 300,
+                                  "letterSpacing": "-0.00833em",
+                                  "lineHeight": 1,
+                                },
+                                "h3": Object {
+                                  "fontFamily": "\\"Roboto\\", \\"Helvetica\\", \\"Arial\\", sans-serif",
+                                  "fontSize": "3rem",
+                                  "fontWeight": 400,
+                                  "letterSpacing": "0em",
+                                  "lineHeight": 1.04,
+                                },
+                                "h4": Object {
+                                  "fontFamily": "\\"Roboto\\", \\"Helvetica\\", \\"Arial\\", sans-serif",
+                                  "fontSize": "2.125rem",
+                                  "fontWeight": 400,
+                                  "letterSpacing": "0.00735em",
+                                  "lineHeight": 1.17,
+                                },
+                                "h5": Object {
+                                  "fontFamily": "\\"Roboto\\", \\"Helvetica\\", \\"Arial\\", sans-serif",
+                                  "fontSize": "1.5rem",
+                                  "fontWeight": 400,
+                                  "letterSpacing": "0em",
+                                  "lineHeight": 1.33,
+                                },
+                                "h6": Object {
+                                  "fontFamily": "\\"Roboto\\", \\"Helvetica\\", \\"Arial\\", sans-serif",
+                                  "fontSize": "1.25rem",
+                                  "fontWeight": 500,
+                                  "letterSpacing": "0.0075em",
+                                  "lineHeight": 1.6,
+                                },
+                                "htmlFontSize": 16,
+                                "overline": Object {
+                                  "fontFamily": "\\"Roboto\\", \\"Helvetica\\", \\"Arial\\", sans-serif",
+                                  "fontSize": "0.75rem",
+                                  "fontWeight": 400,
+                                  "letterSpacing": "0.08333em",
+                                  "lineHeight": 2.66,
+                                  "textTransform": "uppercase",
+                                },
+                                "pxToRem": [Function],
+                                "round": [Function],
+                                "subtitle1": Object {
+                                  "fontFamily": "\\"Roboto\\", \\"Helvetica\\", \\"Arial\\", sans-serif",
+                                  "fontSize": "1rem",
+                                  "fontWeight": 400,
+                                  "letterSpacing": "0.00938em",
+                                  "lineHeight": 1.75,
+                                },
+                                "subtitle2": Object {
+                                  "fontFamily": "\\"Roboto\\", \\"Helvetica\\", \\"Arial\\", sans-serif",
+                                  "fontSize": "0.875rem",
+                                  "fontWeight": 500,
+                                  "letterSpacing": "0.00714em",
+                                  "lineHeight": 1.57,
+                                },
+                              },
+                              "zIndex": Object {
+                                "appBar": 1100,
+                                "drawer": 1200,
+                                "mobileStepper": 1000,
+                                "modal": 1300,
+                                "snackbar": 1400,
+                                "tooltip": 1500,
+                              },
+                            }
+                          }
+                          timeout={
+                            Object {
+                              "enter": 225,
+                              "exit": 195,
+                            }
+                          }
+                        >
+                          <Transition
+                            appear={true}
+                            enter={true}
+                            exit={true}
+                            in={true}
+                            mountOnEnter={false}
+                            onEnter={[Function]}
+                            onEntered={[Function]}
+                            onEntering={[Function]}
+                            onExit={[Function]}
+                            onExited={[Function]}
+                            onExiting={[Function]}
+                            timeout={
+                              Object {
+                                "enter": 225,
+                                "exit": 195,
+                              }
+                            }
+                            unmountOnExit={false}
+                          >
+                            <WithStyles(ForwardRef(Paper))
+                              className="MuiDrawer-paper Drawer-drawerPaper-104 MuiDrawer-paperAnchorLeft MuiDrawer-paperAnchorDockedLeft"
+                              elevation={0}
+                              square={true}
+                              style={
+                                Object {
+                                  "visibility": undefined,
+                                }
+                              }
+                            >
+                              <ForwardRef(Paper)
+                                className="MuiDrawer-paper Drawer-drawerPaper-104 MuiDrawer-paperAnchorLeft MuiDrawer-paperAnchorDockedLeft"
+                                classes={
+                                  Object {
+                                    "elevation0": "MuiPaper-elevation0",
+                                    "elevation1": "MuiPaper-elevation1",
+                                    "elevation10": "MuiPaper-elevation10",
+                                    "elevation11": "MuiPaper-elevation11",
+                                    "elevation12": "MuiPaper-elevation12",
+                                    "elevation13": "MuiPaper-elevation13",
+                                    "elevation14": "MuiPaper-elevation14",
+                                    "elevation15": "MuiPaper-elevation15",
+                                    "elevation16": "MuiPaper-elevation16",
+                                    "elevation17": "MuiPaper-elevation17",
+                                    "elevation18": "MuiPaper-elevation18",
+                                    "elevation19": "MuiPaper-elevation19",
+                                    "elevation2": "MuiPaper-elevation2",
+                                    "elevation20": "MuiPaper-elevation20",
+                                    "elevation21": "MuiPaper-elevation21",
+                                    "elevation22": "MuiPaper-elevation22",
+                                    "elevation23": "MuiPaper-elevation23",
+                                    "elevation24": "MuiPaper-elevation24",
+                                    "elevation3": "MuiPaper-elevation3",
+                                    "elevation4": "MuiPaper-elevation4",
+                                    "elevation5": "MuiPaper-elevation5",
+                                    "elevation6": "MuiPaper-elevation6",
+                                    "elevation7": "MuiPaper-elevation7",
+                                    "elevation8": "MuiPaper-elevation8",
+                                    "elevation9": "MuiPaper-elevation9",
+                                    "root": "MuiPaper-root",
+                                    "rounded": "MuiPaper-rounded",
+                                  }
+                                }
+                                elevation={0}
+                                square={true}
+                                style={
+                                  Object {
+                                    "visibility": undefined,
+                                  }
+                                }
+                              >
+                                <div
+                                  className="MuiPaper-root MuiPaper-elevation0 MuiDrawer-paper Drawer-drawerPaper-104 MuiDrawer-paperAnchorLeft MuiDrawer-paperAnchorDockedLeft"
+                                  style={
+                                    Object {
+                                      "visibility": undefined,
+                                    }
+                                  }
+                                >
+                                  <div>
+                                    <div
+                                      className="Drawer-drawerHeader-105"
+                                    >
+                                      <WithStyles(ForwardRef(IconButton))
+                                        onClick={[Function]}
+                                      >
+                                        <ForwardRef(IconButton)
+                                          classes={
+                                            Object {
+                                              "colorInherit": "MuiIconButton-colorInherit",
+                                              "colorPrimary": "MuiIconButton-colorPrimary",
+                                              "colorSecondary": "MuiIconButton-colorSecondary",
+                                              "disabled": "Mui-disabled",
+                                              "edgeEnd": "MuiIconButton-edgeEnd",
+                                              "edgeStart": "MuiIconButton-edgeStart",
+                                              "label": "MuiIconButton-label",
+                                              "root": "MuiIconButton-root",
+                                              "sizeSmall": "MuiIconButton-sizeSmall",
+                                            }
+                                          }
+                                          onClick={[Function]}
+                                        >
+                                          <WithStyles(ForwardRef(ButtonBase))
+                                            centerRipple={true}
+                                            className="MuiIconButton-root"
+                                            disabled={false}
+                                            focusRipple={true}
+                                            onClick={[Function]}
+                                          >
+                                            <ForwardRef(ButtonBase)
+                                              centerRipple={true}
+                                              className="MuiIconButton-root"
+                                              classes={
+                                                Object {
+                                                  "disabled": "Mui-disabled",
+                                                  "focusVisible": "Mui-focusVisible",
+                                                  "root": "MuiButtonBase-root",
+                                                }
+                                              }
+                                              disabled={false}
+                                              focusRipple={true}
+                                              onClick={[Function]}
+                                            >
+                                              <button
+                                                className="MuiButtonBase-root MuiIconButton-root"
+                                                disabled={false}
+                                                onBlur={[Function]}
+                                                onClick={[Function]}
+                                                onFocus={[Function]}
+                                                onKeyDown={[Function]}
+                                                onKeyUp={[Function]}
+                                                onMouseDown={[Function]}
+                                                onMouseLeave={[Function]}
+                                                onMouseUp={[Function]}
+                                                onTouchEnd={[Function]}
+                                                onTouchMove={[Function]}
+                                                onTouchStart={[Function]}
+                                                tabIndex={0}
+                                                type="button"
+                                              >
+                                                <span
+                                                  className="MuiIconButton-label"
+                                                >
+                                                  <ForwardRef>
+                                                    <WithStyles(ForwardRef(SvgIcon))>
+                                                      <ForwardRef(SvgIcon)
+                                                        classes={
+                                                          Object {
+                                                            "colorAction": "MuiSvgIcon-colorAction",
+                                                            "colorDisabled": "MuiSvgIcon-colorDisabled",
+                                                            "colorError": "MuiSvgIcon-colorError",
+                                                            "colorPrimary": "MuiSvgIcon-colorPrimary",
+                                                            "colorSecondary": "MuiSvgIcon-colorSecondary",
+                                                            "fontSizeInherit": "MuiSvgIcon-fontSizeInherit",
+                                                            "fontSizeLarge": "MuiSvgIcon-fontSizeLarge",
+                                                            "fontSizeSmall": "MuiSvgIcon-fontSizeSmall",
+                                                            "root": "MuiSvgIcon-root",
+                                                          }
+                                                        }
+                                                      >
+                                                        <svg
+                                                          aria-hidden="true"
+                                                          className="MuiSvgIcon-root"
+                                                          focusable="false"
+                                                          role="presentation"
+                                                          viewBox="0 0 24 24"
+                                                        >
+                                                          <path
+                                                            d="M15.41 7.41L14 6l-6 6 6 6 1.41-1.41L10.83 12z"
+                                                          />
+                                                          <path
+                                                            d="M0 0h24v24H0z"
+                                                            fill="none"
+                                                          />
+                                                        </svg>
+                                                      </ForwardRef(SvgIcon)>
+                                                    </WithStyles(ForwardRef(SvgIcon))>
+                                                  </ForwardRef>
+                                                </span>
+                                                <NoSsr>
+                                                  <WithStyles(TouchRipple)
+                                                    center={true}
+                                                  >
+                                                    <TouchRipple
+                                                      center={true}
+                                                      classes={
+                                                        Object {
+                                                          "child": "MuiTouchRipple-child",
+                                                          "childLeaving": "MuiTouchRipple-childLeaving",
+                                                          "childPulsate": "MuiTouchRipple-childPulsate",
+                                                          "ripple": "MuiTouchRipple-ripple",
+                                                          "ripplePulsate": "MuiTouchRipple-ripplePulsate",
+                                                          "rippleVisible": "MuiTouchRipple-rippleVisible",
+                                                          "root": "MuiTouchRipple-root",
+                                                        }
+                                                      }
+                                                    >
+                                                      <span
+                                                        className="MuiTouchRipple-root"
+                                                      >
+                                                        <TransitionGroup
+                                                          childFactory={[Function]}
+                                                          component={null}
+                                                          enter={true}
+                                                          exit={true}
+                                                        />
+                                                      </span>
+                                                    </TouchRipple>
+                                                  </WithStyles(TouchRipple)>
+                                                </NoSsr>
+                                              </button>
+                                            </ForwardRef(ButtonBase)>
+                                          </WithStyles(ForwardRef(ButtonBase))>
+                                        </ForwardRef(IconButton)>
+                                      </WithStyles(ForwardRef(IconButton))>
+                                    </div>
+                                    <WithStyles(ForwardRef(Divider))>
+                                      <ForwardRef(Divider)
+                                        classes={
+                                          Object {
+                                            "absolute": "MuiDivider-absolute",
+                                            "inset": "MuiDivider-inset",
+                                            "light": "MuiDivider-light",
+                                            "middle": "MuiDivider-middle",
+                                            "root": "MuiDivider-root",
+                                          }
+                                        }
+                                      >
+                                        <hr
+                                          className="MuiDivider-root"
+                                        />
+                                      </ForwardRef(Divider)>
+                                    </WithStyles(ForwardRef(Divider))>
+                                    <WithStyles(Menu)
+                                      data={
+                                        Array [
+                                          Object {
+                                            "icon": null,
+                                            "title": "Dashboard",
+                                            "type": "link",
+                                            "url": "/",
+                                          },
+                                          Object {
+                                            "isDisabled": true,
+                                            "title": "New portfolio",
+                                            "type": "link",
+                                            "url": "/portfolio",
+                                          },
+                                          Object {
+                                            "type": "divider",
+                                          },
+                                          Object {
+                                            "icon": Object {
+                                              "$$typeof": Symbol(react.memo),
+                                              "compare": null,
+                                              "displayName": "BugReportIcon",
+                                              "muiName": "SvgIcon",
+                                              "type": Object {
+                                                "$$typeof": Symbol(react.forward_ref),
+                                                "render": [Function],
+                                              },
+                                            },
+                                            "title": "Report a bug",
+                                            "type": "link",
+                                            "url": "/bug",
+                                          },
+                                        ]
+                                      }
+                                      redirectTo={[Function]}
+                                    >
+                                      <Menu
+                                        classes={
+                                          Object {
+                                            "root": "Menu-root-123",
+                                          }
+                                        }
+                                        data={
+                                          Array [
+                                            Object {
+                                              "icon": null,
+                                              "title": "Dashboard",
+                                              "type": "link",
+                                              "url": "/",
+                                            },
+                                            Object {
+                                              "isDisabled": true,
+                                              "title": "New portfolio",
+                                              "type": "link",
+                                              "url": "/portfolio",
+                                            },
+                                            Object {
+                                              "type": "divider",
+                                            },
+                                            Object {
+                                              "icon": Object {
+                                                "$$typeof": Symbol(react.memo),
+                                                "compare": null,
+                                                "displayName": "BugReportIcon",
+                                                "muiName": "SvgIcon",
+                                                "type": Object {
+                                                  "$$typeof": Symbol(react.forward_ref),
+                                                  "render": [Function],
+                                                },
+                                              },
+                                              "title": "Report a bug",
+                                              "type": "link",
+                                              "url": "/bug",
+                                            },
+                                          ]
+                                        }
+                                        redirectTo={[Function]}
+                                      >
+                                        <div
+                                          className="Menu-root-123"
+                                        >
+                                          <WithStyles(ForwardRef(List))>
+                                            <ForwardRef(List)
+                                              classes={
+                                                Object {
+                                                  "dense": "MuiList-dense",
+                                                  "padding": "MuiList-padding",
+                                                  "root": "MuiList-root",
+                                                  "subheader": "MuiList-subheader",
+                                                }
+                                              }
+                                            >
+                                              <ul
+                                                className="MuiList-root MuiList-padding"
+                                              >
+                                                <WithStyles(MenuItem)
+                                                  icon={null}
+                                                  key="menu-92.88187"
+                                                  redirectTo={[Function]}
+                                                  title="Dashboard"
+                                                  url="/"
+                                                >
+                                                  <MenuItem
+                                                    classes={
+                                                      Object {
+                                                        "isDisabled": "MenuItem-isDisabled-128",
+                                                      }
+                                                    }
+                                                    icon={null}
+                                                    isDisabled={false}
+                                                    redirectTo={[Function]}
+                                                    title="Dashboard"
+                                                    url="/"
+                                                  >
+                                                    <WithStyles(ForwardRef(ListItem))
+                                                      button={true}
+                                                      className=""
+                                                      onClick={[Function]}
+                                                    >
+                                                      <ForwardRef(ListItem)
+                                                        button={true}
+                                                        className=""
+                                                        classes={
+                                                          Object {
+                                                            "alignItemsFlexStart": "MuiListItem-alignItemsFlexStart",
+                                                            "button": "MuiListItem-button",
+                                                            "container": "MuiListItem-container",
+                                                            "dense": "MuiListItem-dense",
+                                                            "disabled": "Mui-disabled",
+                                                            "divider": "MuiListItem-divider",
+                                                            "focusVisible": "Mui-focusVisible",
+                                                            "gutters": "MuiListItem-gutters",
+                                                            "root": "MuiListItem-root",
+                                                            "secondaryAction": "MuiListItem-secondaryAction",
+                                                            "selected": "Mui-selected",
+                                                          }
+                                                        }
+                                                        onClick={[Function]}
+                                                      >
+                                                        <WithStyles(ForwardRef(ButtonBase))
+                                                          className="MuiListItem-root MuiListItem-gutters MuiListItem-button"
+                                                          component="div"
+                                                          disabled={false}
+                                                          focusVisibleClassName="Mui-focusVisible"
+                                                          onClick={[Function]}
+                                                        >
+                                                          <ForwardRef(ButtonBase)
+                                                            className="MuiListItem-root MuiListItem-gutters MuiListItem-button"
+                                                            classes={
+                                                              Object {
+                                                                "disabled": "Mui-disabled",
+                                                                "focusVisible": "Mui-focusVisible",
+                                                                "root": "MuiButtonBase-root",
+                                                              }
+                                                            }
+                                                            component="div"
+                                                            disabled={false}
+                                                            focusVisibleClassName="Mui-focusVisible"
+                                                            onClick={[Function]}
+                                                          >
+                                                            <div
+                                                              aria-disabled={false}
+                                                              className="MuiButtonBase-root MuiListItem-root MuiListItem-gutters MuiListItem-button"
+                                                              onBlur={[Function]}
+                                                              onClick={[Function]}
+                                                              onFocus={[Function]}
+                                                              onKeyDown={[Function]}
+                                                              onKeyUp={[Function]}
+                                                              onMouseDown={[Function]}
+                                                              onMouseLeave={[Function]}
+                                                              onMouseUp={[Function]}
+                                                              onTouchEnd={[Function]}
+                                                              onTouchMove={[Function]}
+                                                              onTouchStart={[Function]}
+                                                              role="button"
+                                                              tabIndex={0}
+                                                            >
+                                                              <WithStyles(ForwardRef(ListItemText))
+                                                                key=".1"
+                                                                primary="Dashboard"
+                                                              >
+                                                                <ForwardRef(ListItemText)
+                                                                  classes={
+                                                                    Object {
+                                                                      "dense": "MuiListItemText-dense",
+                                                                      "inset": "MuiListItemText-inset",
+                                                                      "multiline": "MuiListItemText-multiline",
+                                                                      "primary": "MuiListItemText-primary",
+                                                                      "root": "MuiListItemText-root",
+                                                                      "secondary": "MuiListItemText-secondary",
+                                                                    }
+                                                                  }
+                                                                  primary="Dashboard"
+                                                                >
+                                                                  <div
+                                                                    className="MuiListItemText-root"
+                                                                  >
+                                                                    <WithStyles(ForwardRef(Typography))
+                                                                      className="MuiListItemText-primary"
+                                                                      component="span"
+                                                                      variant="body1"
+                                                                    >
+                                                                      <ForwardRef(Typography)
+                                                                        className="MuiListItemText-primary"
+                                                                        classes={
+                                                                          Object {
+                                                                            "alignCenter": "MuiTypography-alignCenter",
+                                                                            "alignJustify": "MuiTypography-alignJustify",
+                                                                            "alignLeft": "MuiTypography-alignLeft",
+                                                                            "alignRight": "MuiTypography-alignRight",
+                                                                            "body1": "MuiTypography-body1",
+                                                                            "body2": "MuiTypography-body2",
+                                                                            "button": "MuiTypography-button",
+                                                                            "caption": "MuiTypography-caption",
+                                                                            "colorError": "MuiTypography-colorError",
+                                                                            "colorInherit": "MuiTypography-colorInherit",
+                                                                            "colorPrimary": "MuiTypography-colorPrimary",
+                                                                            "colorSecondary": "MuiTypography-colorSecondary",
+                                                                            "colorTextPrimary": "MuiTypography-colorTextPrimary",
+                                                                            "colorTextSecondary": "MuiTypography-colorTextSecondary",
+                                                                            "displayBlock": "MuiTypography-displayBlock",
+                                                                            "displayInline": "MuiTypography-displayInline",
+                                                                            "gutterBottom": "MuiTypography-gutterBottom",
+                                                                            "h1": "MuiTypography-h1",
+                                                                            "h2": "MuiTypography-h2",
+                                                                            "h3": "MuiTypography-h3",
+                                                                            "h4": "MuiTypography-h4",
+                                                                            "h5": "MuiTypography-h5",
+                                                                            "h6": "MuiTypography-h6",
+                                                                            "noWrap": "MuiTypography-noWrap",
+                                                                            "overline": "MuiTypography-overline",
+                                                                            "paragraph": "MuiTypography-paragraph",
+                                                                            "root": "MuiTypography-root",
+                                                                            "srOnly": "MuiTypography-srOnly",
+                                                                            "subtitle1": "MuiTypography-subtitle1",
+                                                                            "subtitle2": "MuiTypography-subtitle2",
+                                                                          }
+                                                                        }
+                                                                        component="span"
+                                                                        theme={
+                                                                          Object {
+                                                                            "breakpoints": Object {
+                                                                              "between": [Function],
+                                                                              "down": [Function],
+                                                                              "keys": Array [
+                                                                                "xs",
+                                                                                "sm",
+                                                                                "md",
+                                                                                "lg",
+                                                                                "xl",
+                                                                              ],
+                                                                              "only": [Function],
+                                                                              "up": [Function],
+                                                                              "values": Object {
+                                                                                "lg": 1280,
+                                                                                "md": 960,
+                                                                                "sm": 600,
+                                                                                "xl": 1920,
+                                                                                "xs": 0,
+                                                                              },
+                                                                              "width": [Function],
+                                                                            },
+                                                                            "direction": "ltr",
+                                                                            "mixins": Object {
+                                                                              "gutters": [Function],
+                                                                              "toolbar": Object {
+                                                                                "@media (min-width:0px) and (orientation: landscape)": Object {
+                                                                                  "minHeight": 48,
+                                                                                },
+                                                                                "@media (min-width:600px)": Object {
+                                                                                  "minHeight": 64,
+                                                                                },
+                                                                                "minHeight": 56,
+                                                                              },
+                                                                            },
+                                                                            "overrides": Object {},
+                                                                            "palette": Object {
+                                                                              "action": Object {
+                                                                                "active": "rgba(0, 0, 0, 0.54)",
+                                                                                "disabled": "rgba(0, 0, 0, 0.26)",
+                                                                                "disabledBackground": "rgba(0, 0, 0, 0.12)",
+                                                                                "hover": "rgba(0, 0, 0, 0.08)",
+                                                                                "hoverOpacity": 0.08,
+                                                                                "selected": "rgba(0, 0, 0, 0.14)",
+                                                                              },
+                                                                              "augmentColor": [Function],
+                                                                              "background": Object {
+                                                                                "default": "#fafafa",
+                                                                                "paper": "#fff",
+                                                                              },
+                                                                              "common": Object {
+                                                                                "black": "#000",
+                                                                                "white": "#fff",
+                                                                              },
+                                                                              "contrastThreshold": 3,
+                                                                              "divider": "rgba(0, 0, 0, 0.12)",
+                                                                              "error": Object {
+                                                                                "contrastText": "#fff",
+                                                                                "dark": "#d32f2f",
+                                                                                "light": "#e57373",
+                                                                                "main": "#f44336",
+                                                                              },
+                                                                              "getContrastText": [Function],
+                                                                              "grey": Object {
+                                                                                "100": "#f5f5f5",
+                                                                                "200": "#eeeeee",
+                                                                                "300": "#e0e0e0",
+                                                                                "400": "#bdbdbd",
+                                                                                "50": "#fafafa",
+                                                                                "500": "#9e9e9e",
+                                                                                "600": "#757575",
+                                                                                "700": "#616161",
+                                                                                "800": "#424242",
+                                                                                "900": "#212121",
+                                                                                "A100": "#d5d5d5",
+                                                                                "A200": "#aaaaaa",
+                                                                                "A400": "#303030",
+                                                                                "A700": "#616161",
+                                                                              },
+                                                                              "primary": Object {
+                                                                                "contrastText": "#fff",
+                                                                                "dark": "#303f9f",
+                                                                                "light": "#7986cb",
+                                                                                "main": "#3f51b5",
+                                                                              },
+                                                                              "secondary": Object {
+                                                                                "contrastText": "#fff",
+                                                                                "dark": "#c51162",
+                                                                                "light": "#ff4081",
+                                                                                "main": "#f50057",
+                                                                              },
+                                                                              "text": Object {
+                                                                                "disabled": "rgba(0, 0, 0, 0.38)",
+                                                                                "hint": "rgba(0, 0, 0, 0.38)",
+                                                                                "primary": "rgba(0, 0, 0, 0.87)",
+                                                                                "secondary": "rgba(0, 0, 0, 0.54)",
+                                                                              },
+                                                                              "tonalOffset": 0.2,
+                                                                              "type": "light",
+                                                                            },
+                                                                            "props": Object {},
+                                                                            "shadows": Array [
+                                                                              "none",
+                                                                              "0px 1px 3px 0px rgba(0,0,0,0.2),0px 1px 1px 0px rgba(0,0,0,0.14),0px 2px 1px -1px rgba(0,0,0,0.12)",
+                                                                              "0px 1px 5px 0px rgba(0,0,0,0.2),0px 2px 2px 0px rgba(0,0,0,0.14),0px 3px 1px -2px rgba(0,0,0,0.12)",
+                                                                              "0px 1px 8px 0px rgba(0,0,0,0.2),0px 3px 4px 0px rgba(0,0,0,0.14),0px 3px 3px -2px rgba(0,0,0,0.12)",
+                                                                              "0px 2px 4px -1px rgba(0,0,0,0.2),0px 4px 5px 0px rgba(0,0,0,0.14),0px 1px 10px 0px rgba(0,0,0,0.12)",
+                                                                              "0px 3px 5px -1px rgba(0,0,0,0.2),0px 5px 8px 0px rgba(0,0,0,0.14),0px 1px 14px 0px rgba(0,0,0,0.12)",
+                                                                              "0px 3px 5px -1px rgba(0,0,0,0.2),0px 6px 10px 0px rgba(0,0,0,0.14),0px 1px 18px 0px rgba(0,0,0,0.12)",
+                                                                              "0px 4px 5px -2px rgba(0,0,0,0.2),0px 7px 10px 1px rgba(0,0,0,0.14),0px 2px 16px 1px rgba(0,0,0,0.12)",
+                                                                              "0px 5px 5px -3px rgba(0,0,0,0.2),0px 8px 10px 1px rgba(0,0,0,0.14),0px 3px 14px 2px rgba(0,0,0,0.12)",
+                                                                              "0px 5px 6px -3px rgba(0,0,0,0.2),0px 9px 12px 1px rgba(0,0,0,0.14),0px 3px 16px 2px rgba(0,0,0,0.12)",
+                                                                              "0px 6px 6px -3px rgba(0,0,0,0.2),0px 10px 14px 1px rgba(0,0,0,0.14),0px 4px 18px 3px rgba(0,0,0,0.12)",
+                                                                              "0px 6px 7px -4px rgba(0,0,0,0.2),0px 11px 15px 1px rgba(0,0,0,0.14),0px 4px 20px 3px rgba(0,0,0,0.12)",
+                                                                              "0px 7px 8px -4px rgba(0,0,0,0.2),0px 12px 17px 2px rgba(0,0,0,0.14),0px 5px 22px 4px rgba(0,0,0,0.12)",
+                                                                              "0px 7px 8px -4px rgba(0,0,0,0.2),0px 13px 19px 2px rgba(0,0,0,0.14),0px 5px 24px 4px rgba(0,0,0,0.12)",
+                                                                              "0px 7px 9px -4px rgba(0,0,0,0.2),0px 14px 21px 2px rgba(0,0,0,0.14),0px 5px 26px 4px rgba(0,0,0,0.12)",
+                                                                              "0px 8px 9px -5px rgba(0,0,0,0.2),0px 15px 22px 2px rgba(0,0,0,0.14),0px 6px 28px 5px rgba(0,0,0,0.12)",
+                                                                              "0px 8px 10px -5px rgba(0,0,0,0.2),0px 16px 24px 2px rgba(0,0,0,0.14),0px 6px 30px 5px rgba(0,0,0,0.12)",
+                                                                              "0px 8px 11px -5px rgba(0,0,0,0.2),0px 17px 26px 2px rgba(0,0,0,0.14),0px 6px 32px 5px rgba(0,0,0,0.12)",
+                                                                              "0px 9px 11px -5px rgba(0,0,0,0.2),0px 18px 28px 2px rgba(0,0,0,0.14),0px 7px 34px 6px rgba(0,0,0,0.12)",
+                                                                              "0px 9px 12px -6px rgba(0,0,0,0.2),0px 19px 29px 2px rgba(0,0,0,0.14),0px 7px 36px 6px rgba(0,0,0,0.12)",
+                                                                              "0px 10px 13px -6px rgba(0,0,0,0.2),0px 20px 31px 3px rgba(0,0,0,0.14),0px 8px 38px 7px rgba(0,0,0,0.12)",
+                                                                              "0px 10px 13px -6px rgba(0,0,0,0.2),0px 21px 33px 3px rgba(0,0,0,0.14),0px 8px 40px 7px rgba(0,0,0,0.12)",
+                                                                              "0px 10px 14px -6px rgba(0,0,0,0.2),0px 22px 35px 3px rgba(0,0,0,0.14),0px 8px 42px 7px rgba(0,0,0,0.12)",
+                                                                              "0px 11px 14px -7px rgba(0,0,0,0.2),0px 23px 36px 3px rgba(0,0,0,0.14),0px 9px 44px 8px rgba(0,0,0,0.12)",
+                                                                              "0px 11px 15px -7px rgba(0,0,0,0.2),0px 24px 38px 3px rgba(0,0,0,0.14),0px 9px 46px 8px rgba(0,0,0,0.12)",
+                                                                            ],
+                                                                            "shape": Object {
+                                                                              "borderRadius": 4,
+                                                                            },
+                                                                            "spacing": [Function],
+                                                                            "transitions": Object {
+                                                                              "create": [Function],
+                                                                              "duration": Object {
+                                                                                "complex": 375,
+                                                                                "enteringScreen": 225,
+                                                                                "leavingScreen": 195,
+                                                                                "short": 250,
+                                                                                "shorter": 200,
+                                                                                "shortest": 150,
+                                                                                "standard": 300,
+                                                                              },
+                                                                              "easing": Object {
+                                                                                "easeIn": "cubic-bezier(0.4, 0, 1, 1)",
+                                                                                "easeInOut": "cubic-bezier(0.4, 0, 0.2, 1)",
+                                                                                "easeOut": "cubic-bezier(0.0, 0, 0.2, 1)",
+                                                                                "sharp": "cubic-bezier(0.4, 0, 0.6, 1)",
+                                                                              },
+                                                                              "getAutoHeightDuration": [Function],
+                                                                            },
+                                                                            "typography": Object {
+                                                                              "body1": Object {
+                                                                                "fontFamily": "\\"Roboto\\", \\"Helvetica\\", \\"Arial\\", sans-serif",
+                                                                                "fontSize": "1rem",
+                                                                                "fontWeight": 400,
+                                                                                "letterSpacing": "0.00938em",
+                                                                                "lineHeight": 1.5,
+                                                                              },
+                                                                              "body2": Object {
+                                                                                "fontFamily": "\\"Roboto\\", \\"Helvetica\\", \\"Arial\\", sans-serif",
+                                                                                "fontSize": "0.875rem",
+                                                                                "fontWeight": 400,
+                                                                                "letterSpacing": "0.01071em",
+                                                                                "lineHeight": 1.43,
+                                                                              },
+                                                                              "button": Object {
+                                                                                "fontFamily": "\\"Roboto\\", \\"Helvetica\\", \\"Arial\\", sans-serif",
+                                                                                "fontSize": "0.875rem",
+                                                                                "fontWeight": 500,
+                                                                                "letterSpacing": "0.02857em",
+                                                                                "lineHeight": 1.75,
+                                                                                "textTransform": "uppercase",
+                                                                              },
+                                                                              "caption": Object {
+                                                                                "fontFamily": "\\"Roboto\\", \\"Helvetica\\", \\"Arial\\", sans-serif",
+                                                                                "fontSize": "0.75rem",
+                                                                                "fontWeight": 400,
+                                                                                "letterSpacing": "0.03333em",
+                                                                                "lineHeight": 1.66,
+                                                                              },
+                                                                              "fontFamily": "\\"Roboto\\", \\"Helvetica\\", \\"Arial\\", sans-serif",
+                                                                              "fontSize": 14,
+                                                                              "fontWeightBold": 700,
+                                                                              "fontWeightLight": 300,
+                                                                              "fontWeightMedium": 500,
+                                                                              "fontWeightRegular": 400,
+                                                                              "h1": Object {
+                                                                                "fontFamily": "\\"Roboto\\", \\"Helvetica\\", \\"Arial\\", sans-serif",
+                                                                                "fontSize": "6rem",
+                                                                                "fontWeight": 300,
+                                                                                "letterSpacing": "-0.01562em",
+                                                                                "lineHeight": 1,
+                                                                              },
+                                                                              "h2": Object {
+                                                                                "fontFamily": "\\"Roboto\\", \\"Helvetica\\", \\"Arial\\", sans-serif",
+                                                                                "fontSize": "3.75rem",
+                                                                                "fontWeight": 300,
+                                                                                "letterSpacing": "-0.00833em",
+                                                                                "lineHeight": 1,
+                                                                              },
+                                                                              "h3": Object {
+                                                                                "fontFamily": "\\"Roboto\\", \\"Helvetica\\", \\"Arial\\", sans-serif",
+                                                                                "fontSize": "3rem",
+                                                                                "fontWeight": 400,
+                                                                                "letterSpacing": "0em",
+                                                                                "lineHeight": 1.04,
+                                                                              },
+                                                                              "h4": Object {
+                                                                                "fontFamily": "\\"Roboto\\", \\"Helvetica\\", \\"Arial\\", sans-serif",
+                                                                                "fontSize": "2.125rem",
+                                                                                "fontWeight": 400,
+                                                                                "letterSpacing": "0.00735em",
+                                                                                "lineHeight": 1.17,
+                                                                              },
+                                                                              "h5": Object {
+                                                                                "fontFamily": "\\"Roboto\\", \\"Helvetica\\", \\"Arial\\", sans-serif",
+                                                                                "fontSize": "1.5rem",
+                                                                                "fontWeight": 400,
+                                                                                "letterSpacing": "0em",
+                                                                                "lineHeight": 1.33,
+                                                                              },
+                                                                              "h6": Object {
+                                                                                "fontFamily": "\\"Roboto\\", \\"Helvetica\\", \\"Arial\\", sans-serif",
+                                                                                "fontSize": "1.25rem",
+                                                                                "fontWeight": 500,
+                                                                                "letterSpacing": "0.0075em",
+                                                                                "lineHeight": 1.6,
+                                                                              },
+                                                                              "htmlFontSize": 16,
+                                                                              "overline": Object {
+                                                                                "fontFamily": "\\"Roboto\\", \\"Helvetica\\", \\"Arial\\", sans-serif",
+                                                                                "fontSize": "0.75rem",
+                                                                                "fontWeight": 400,
+                                                                                "letterSpacing": "0.08333em",
+                                                                                "lineHeight": 2.66,
+                                                                                "textTransform": "uppercase",
+                                                                              },
+                                                                              "pxToRem": [Function],
+                                                                              "round": [Function],
+                                                                              "subtitle1": Object {
+                                                                                "fontFamily": "\\"Roboto\\", \\"Helvetica\\", \\"Arial\\", sans-serif",
+                                                                                "fontSize": "1rem",
+                                                                                "fontWeight": 400,
+                                                                                "letterSpacing": "0.00938em",
+                                                                                "lineHeight": 1.75,
+                                                                              },
+                                                                              "subtitle2": Object {
+                                                                                "fontFamily": "\\"Roboto\\", \\"Helvetica\\", \\"Arial\\", sans-serif",
+                                                                                "fontSize": "0.875rem",
+                                                                                "fontWeight": 500,
+                                                                                "letterSpacing": "0.00714em",
+                                                                                "lineHeight": 1.57,
+                                                                              },
+                                                                            },
+                                                                            "zIndex": Object {
+                                                                              "appBar": 1100,
+                                                                              "drawer": 1200,
+                                                                              "mobileStepper": 1000,
+                                                                              "modal": 1300,
+                                                                              "snackbar": 1400,
+                                                                              "tooltip": 1500,
+                                                                            },
+                                                                          }
+                                                                        }
+                                                                        variant="body1"
+                                                                      >
+                                                                        <span
+                                                                          className="MuiTypography-root MuiListItemText-primary MuiTypography-body1"
+                                                                        >
+                                                                          Dashboard
+                                                                        </span>
+                                                                      </ForwardRef(Typography)>
+                                                                    </WithStyles(ForwardRef(Typography))>
+                                                                  </div>
+                                                                </ForwardRef(ListItemText)>
+                                                              </WithStyles(ForwardRef(ListItemText))>
+                                                              <NoSsr>
+                                                                <WithStyles(TouchRipple)
+                                                                  center={false}
+                                                                >
+                                                                  <TouchRipple
+                                                                    center={false}
+                                                                    classes={
+                                                                      Object {
+                                                                        "child": "MuiTouchRipple-child",
+                                                                        "childLeaving": "MuiTouchRipple-childLeaving",
+                                                                        "childPulsate": "MuiTouchRipple-childPulsate",
+                                                                        "ripple": "MuiTouchRipple-ripple",
+                                                                        "ripplePulsate": "MuiTouchRipple-ripplePulsate",
+                                                                        "rippleVisible": "MuiTouchRipple-rippleVisible",
+                                                                        "root": "MuiTouchRipple-root",
+                                                                      }
+                                                                    }
+                                                                  >
+                                                                    <span
+                                                                      className="MuiTouchRipple-root"
+                                                                    >
+                                                                      <TransitionGroup
+                                                                        childFactory={[Function]}
+                                                                        component={null}
+                                                                        enter={true}
+                                                                        exit={true}
+                                                                      />
+                                                                    </span>
+                                                                  </TouchRipple>
+                                                                </WithStyles(TouchRipple)>
+                                                              </NoSsr>
+                                                            </div>
+                                                          </ForwardRef(ButtonBase)>
+                                                        </WithStyles(ForwardRef(ButtonBase))>
+                                                      </ForwardRef(ListItem)>
+                                                    </WithStyles(ForwardRef(ListItem))>
+                                                  </MenuItem>
+                                                </WithStyles(MenuItem)>
+                                                <WithStyles(MenuItem)
+                                                  isDisabled={true}
+                                                  key="menu-84.79256"
+                                                  redirectTo={[Function]}
+                                                  title="New portfolio"
+                                                  url="/portfolio"
+                                                >
+                                                  <MenuItem
+                                                    classes={
+                                                      Object {
+                                                        "isDisabled": "MenuItem-isDisabled-128",
+                                                      }
+                                                    }
+                                                    icon={null}
+                                                    isDisabled={true}
+                                                    redirectTo={[Function]}
+                                                    title="New portfolio"
+                                                    url="/portfolio"
+                                                  >
+                                                    <WithStyles(ForwardRef(ListItem))
+                                                      button={true}
+                                                      className="MenuItem-isDisabled-128"
+                                                      onClick={[Function]}
+                                                    >
+                                                      <ForwardRef(ListItem)
+                                                        button={true}
+                                                        className="MenuItem-isDisabled-128"
+                                                        classes={
+                                                          Object {
+                                                            "alignItemsFlexStart": "MuiListItem-alignItemsFlexStart",
+                                                            "button": "MuiListItem-button",
+                                                            "container": "MuiListItem-container",
+                                                            "dense": "MuiListItem-dense",
+                                                            "disabled": "Mui-disabled",
+                                                            "divider": "MuiListItem-divider",
+                                                            "focusVisible": "Mui-focusVisible",
+                                                            "gutters": "MuiListItem-gutters",
+                                                            "root": "MuiListItem-root",
+                                                            "secondaryAction": "MuiListItem-secondaryAction",
+                                                            "selected": "Mui-selected",
+                                                          }
+                                                        }
+                                                        onClick={[Function]}
+                                                      >
+                                                        <WithStyles(ForwardRef(ButtonBase))
+                                                          className="MuiListItem-root MenuItem-isDisabled-128 MuiListItem-gutters MuiListItem-button"
+                                                          component="div"
+                                                          disabled={false}
+                                                          focusVisibleClassName="Mui-focusVisible"
+                                                          onClick={[Function]}
+                                                        >
+                                                          <ForwardRef(ButtonBase)
+                                                            className="MuiListItem-root MenuItem-isDisabled-128 MuiListItem-gutters MuiListItem-button"
+                                                            classes={
+                                                              Object {
+                                                                "disabled": "Mui-disabled",
+                                                                "focusVisible": "Mui-focusVisible",
+                                                                "root": "MuiButtonBase-root",
+                                                              }
+                                                            }
+                                                            component="div"
+                                                            disabled={false}
+                                                            focusVisibleClassName="Mui-focusVisible"
+                                                            onClick={[Function]}
+                                                          >
+                                                            <div
+                                                              aria-disabled={false}
+                                                              className="MuiButtonBase-root MuiListItem-root MenuItem-isDisabled-128 MuiListItem-gutters MuiListItem-button"
+                                                              onBlur={[Function]}
+                                                              onClick={[Function]}
+                                                              onFocus={[Function]}
+                                                              onKeyDown={[Function]}
+                                                              onKeyUp={[Function]}
+                                                              onMouseDown={[Function]}
+                                                              onMouseLeave={[Function]}
+                                                              onMouseUp={[Function]}
+                                                              onTouchEnd={[Function]}
+                                                              onTouchMove={[Function]}
+                                                              onTouchStart={[Function]}
+                                                              role="button"
+                                                              tabIndex={0}
+                                                            >
+                                                              <WithStyles(ForwardRef(ListItemText))
+                                                                key=".1"
+                                                                primary="New portfolio"
+                                                              >
+                                                                <ForwardRef(ListItemText)
+                                                                  classes={
+                                                                    Object {
+                                                                      "dense": "MuiListItemText-dense",
+                                                                      "inset": "MuiListItemText-inset",
+                                                                      "multiline": "MuiListItemText-multiline",
+                                                                      "primary": "MuiListItemText-primary",
+                                                                      "root": "MuiListItemText-root",
+                                                                      "secondary": "MuiListItemText-secondary",
+                                                                    }
+                                                                  }
+                                                                  primary="New portfolio"
+                                                                >
+                                                                  <div
+                                                                    className="MuiListItemText-root"
+                                                                  >
+                                                                    <WithStyles(ForwardRef(Typography))
+                                                                      className="MuiListItemText-primary"
+                                                                      component="span"
+                                                                      variant="body1"
+                                                                    >
+                                                                      <ForwardRef(Typography)
+                                                                        className="MuiListItemText-primary"
+                                                                        classes={
+                                                                          Object {
+                                                                            "alignCenter": "MuiTypography-alignCenter",
+                                                                            "alignJustify": "MuiTypography-alignJustify",
+                                                                            "alignLeft": "MuiTypography-alignLeft",
+                                                                            "alignRight": "MuiTypography-alignRight",
+                                                                            "body1": "MuiTypography-body1",
+                                                                            "body2": "MuiTypography-body2",
+                                                                            "button": "MuiTypography-button",
+                                                                            "caption": "MuiTypography-caption",
+                                                                            "colorError": "MuiTypography-colorError",
+                                                                            "colorInherit": "MuiTypography-colorInherit",
+                                                                            "colorPrimary": "MuiTypography-colorPrimary",
+                                                                            "colorSecondary": "MuiTypography-colorSecondary",
+                                                                            "colorTextPrimary": "MuiTypography-colorTextPrimary",
+                                                                            "colorTextSecondary": "MuiTypography-colorTextSecondary",
+                                                                            "displayBlock": "MuiTypography-displayBlock",
+                                                                            "displayInline": "MuiTypography-displayInline",
+                                                                            "gutterBottom": "MuiTypography-gutterBottom",
+                                                                            "h1": "MuiTypography-h1",
+                                                                            "h2": "MuiTypography-h2",
+                                                                            "h3": "MuiTypography-h3",
+                                                                            "h4": "MuiTypography-h4",
+                                                                            "h5": "MuiTypography-h5",
+                                                                            "h6": "MuiTypography-h6",
+                                                                            "noWrap": "MuiTypography-noWrap",
+                                                                            "overline": "MuiTypography-overline",
+                                                                            "paragraph": "MuiTypography-paragraph",
+                                                                            "root": "MuiTypography-root",
+                                                                            "srOnly": "MuiTypography-srOnly",
+                                                                            "subtitle1": "MuiTypography-subtitle1",
+                                                                            "subtitle2": "MuiTypography-subtitle2",
+                                                                          }
+                                                                        }
+                                                                        component="span"
+                                                                        theme={
+                                                                          Object {
+                                                                            "breakpoints": Object {
+                                                                              "between": [Function],
+                                                                              "down": [Function],
+                                                                              "keys": Array [
+                                                                                "xs",
+                                                                                "sm",
+                                                                                "md",
+                                                                                "lg",
+                                                                                "xl",
+                                                                              ],
+                                                                              "only": [Function],
+                                                                              "up": [Function],
+                                                                              "values": Object {
+                                                                                "lg": 1280,
+                                                                                "md": 960,
+                                                                                "sm": 600,
+                                                                                "xl": 1920,
+                                                                                "xs": 0,
+                                                                              },
+                                                                              "width": [Function],
+                                                                            },
+                                                                            "direction": "ltr",
+                                                                            "mixins": Object {
+                                                                              "gutters": [Function],
+                                                                              "toolbar": Object {
+                                                                                "@media (min-width:0px) and (orientation: landscape)": Object {
+                                                                                  "minHeight": 48,
+                                                                                },
+                                                                                "@media (min-width:600px)": Object {
+                                                                                  "minHeight": 64,
+                                                                                },
+                                                                                "minHeight": 56,
+                                                                              },
+                                                                            },
+                                                                            "overrides": Object {},
+                                                                            "palette": Object {
+                                                                              "action": Object {
+                                                                                "active": "rgba(0, 0, 0, 0.54)",
+                                                                                "disabled": "rgba(0, 0, 0, 0.26)",
+                                                                                "disabledBackground": "rgba(0, 0, 0, 0.12)",
+                                                                                "hover": "rgba(0, 0, 0, 0.08)",
+                                                                                "hoverOpacity": 0.08,
+                                                                                "selected": "rgba(0, 0, 0, 0.14)",
+                                                                              },
+                                                                              "augmentColor": [Function],
+                                                                              "background": Object {
+                                                                                "default": "#fafafa",
+                                                                                "paper": "#fff",
+                                                                              },
+                                                                              "common": Object {
+                                                                                "black": "#000",
+                                                                                "white": "#fff",
+                                                                              },
+                                                                              "contrastThreshold": 3,
+                                                                              "divider": "rgba(0, 0, 0, 0.12)",
+                                                                              "error": Object {
+                                                                                "contrastText": "#fff",
+                                                                                "dark": "#d32f2f",
+                                                                                "light": "#e57373",
+                                                                                "main": "#f44336",
+                                                                              },
+                                                                              "getContrastText": [Function],
+                                                                              "grey": Object {
+                                                                                "100": "#f5f5f5",
+                                                                                "200": "#eeeeee",
+                                                                                "300": "#e0e0e0",
+                                                                                "400": "#bdbdbd",
+                                                                                "50": "#fafafa",
+                                                                                "500": "#9e9e9e",
+                                                                                "600": "#757575",
+                                                                                "700": "#616161",
+                                                                                "800": "#424242",
+                                                                                "900": "#212121",
+                                                                                "A100": "#d5d5d5",
+                                                                                "A200": "#aaaaaa",
+                                                                                "A400": "#303030",
+                                                                                "A700": "#616161",
+                                                                              },
+                                                                              "primary": Object {
+                                                                                "contrastText": "#fff",
+                                                                                "dark": "#303f9f",
+                                                                                "light": "#7986cb",
+                                                                                "main": "#3f51b5",
+                                                                              },
+                                                                              "secondary": Object {
+                                                                                "contrastText": "#fff",
+                                                                                "dark": "#c51162",
+                                                                                "light": "#ff4081",
+                                                                                "main": "#f50057",
+                                                                              },
+                                                                              "text": Object {
+                                                                                "disabled": "rgba(0, 0, 0, 0.38)",
+                                                                                "hint": "rgba(0, 0, 0, 0.38)",
+                                                                                "primary": "rgba(0, 0, 0, 0.87)",
+                                                                                "secondary": "rgba(0, 0, 0, 0.54)",
+                                                                              },
+                                                                              "tonalOffset": 0.2,
+                                                                              "type": "light",
+                                                                            },
+                                                                            "props": Object {},
+                                                                            "shadows": Array [
+                                                                              "none",
+                                                                              "0px 1px 3px 0px rgba(0,0,0,0.2),0px 1px 1px 0px rgba(0,0,0,0.14),0px 2px 1px -1px rgba(0,0,0,0.12)",
+                                                                              "0px 1px 5px 0px rgba(0,0,0,0.2),0px 2px 2px 0px rgba(0,0,0,0.14),0px 3px 1px -2px rgba(0,0,0,0.12)",
+                                                                              "0px 1px 8px 0px rgba(0,0,0,0.2),0px 3px 4px 0px rgba(0,0,0,0.14),0px 3px 3px -2px rgba(0,0,0,0.12)",
+                                                                              "0px 2px 4px -1px rgba(0,0,0,0.2),0px 4px 5px 0px rgba(0,0,0,0.14),0px 1px 10px 0px rgba(0,0,0,0.12)",
+                                                                              "0px 3px 5px -1px rgba(0,0,0,0.2),0px 5px 8px 0px rgba(0,0,0,0.14),0px 1px 14px 0px rgba(0,0,0,0.12)",
+                                                                              "0px 3px 5px -1px rgba(0,0,0,0.2),0px 6px 10px 0px rgba(0,0,0,0.14),0px 1px 18px 0px rgba(0,0,0,0.12)",
+                                                                              "0px 4px 5px -2px rgba(0,0,0,0.2),0px 7px 10px 1px rgba(0,0,0,0.14),0px 2px 16px 1px rgba(0,0,0,0.12)",
+                                                                              "0px 5px 5px -3px rgba(0,0,0,0.2),0px 8px 10px 1px rgba(0,0,0,0.14),0px 3px 14px 2px rgba(0,0,0,0.12)",
+                                                                              "0px 5px 6px -3px rgba(0,0,0,0.2),0px 9px 12px 1px rgba(0,0,0,0.14),0px 3px 16px 2px rgba(0,0,0,0.12)",
+                                                                              "0px 6px 6px -3px rgba(0,0,0,0.2),0px 10px 14px 1px rgba(0,0,0,0.14),0px 4px 18px 3px rgba(0,0,0,0.12)",
+                                                                              "0px 6px 7px -4px rgba(0,0,0,0.2),0px 11px 15px 1px rgba(0,0,0,0.14),0px 4px 20px 3px rgba(0,0,0,0.12)",
+                                                                              "0px 7px 8px -4px rgba(0,0,0,0.2),0px 12px 17px 2px rgba(0,0,0,0.14),0px 5px 22px 4px rgba(0,0,0,0.12)",
+                                                                              "0px 7px 8px -4px rgba(0,0,0,0.2),0px 13px 19px 2px rgba(0,0,0,0.14),0px 5px 24px 4px rgba(0,0,0,0.12)",
+                                                                              "0px 7px 9px -4px rgba(0,0,0,0.2),0px 14px 21px 2px rgba(0,0,0,0.14),0px 5px 26px 4px rgba(0,0,0,0.12)",
+                                                                              "0px 8px 9px -5px rgba(0,0,0,0.2),0px 15px 22px 2px rgba(0,0,0,0.14),0px 6px 28px 5px rgba(0,0,0,0.12)",
+                                                                              "0px 8px 10px -5px rgba(0,0,0,0.2),0px 16px 24px 2px rgba(0,0,0,0.14),0px 6px 30px 5px rgba(0,0,0,0.12)",
+                                                                              "0px 8px 11px -5px rgba(0,0,0,0.2),0px 17px 26px 2px rgba(0,0,0,0.14),0px 6px 32px 5px rgba(0,0,0,0.12)",
+                                                                              "0px 9px 11px -5px rgba(0,0,0,0.2),0px 18px 28px 2px rgba(0,0,0,0.14),0px 7px 34px 6px rgba(0,0,0,0.12)",
+                                                                              "0px 9px 12px -6px rgba(0,0,0,0.2),0px 19px 29px 2px rgba(0,0,0,0.14),0px 7px 36px 6px rgba(0,0,0,0.12)",
+                                                                              "0px 10px 13px -6px rgba(0,0,0,0.2),0px 20px 31px 3px rgba(0,0,0,0.14),0px 8px 38px 7px rgba(0,0,0,0.12)",
+                                                                              "0px 10px 13px -6px rgba(0,0,0,0.2),0px 21px 33px 3px rgba(0,0,0,0.14),0px 8px 40px 7px rgba(0,0,0,0.12)",
+                                                                              "0px 10px 14px -6px rgba(0,0,0,0.2),0px 22px 35px 3px rgba(0,0,0,0.14),0px 8px 42px 7px rgba(0,0,0,0.12)",
+                                                                              "0px 11px 14px -7px rgba(0,0,0,0.2),0px 23px 36px 3px rgba(0,0,0,0.14),0px 9px 44px 8px rgba(0,0,0,0.12)",
+                                                                              "0px 11px 15px -7px rgba(0,0,0,0.2),0px 24px 38px 3px rgba(0,0,0,0.14),0px 9px 46px 8px rgba(0,0,0,0.12)",
+                                                                            ],
+                                                                            "shape": Object {
+                                                                              "borderRadius": 4,
+                                                                            },
+                                                                            "spacing": [Function],
+                                                                            "transitions": Object {
+                                                                              "create": [Function],
+                                                                              "duration": Object {
+                                                                                "complex": 375,
+                                                                                "enteringScreen": 225,
+                                                                                "leavingScreen": 195,
+                                                                                "short": 250,
+                                                                                "shorter": 200,
+                                                                                "shortest": 150,
+                                                                                "standard": 300,
+                                                                              },
+                                                                              "easing": Object {
+                                                                                "easeIn": "cubic-bezier(0.4, 0, 1, 1)",
+                                                                                "easeInOut": "cubic-bezier(0.4, 0, 0.2, 1)",
+                                                                                "easeOut": "cubic-bezier(0.0, 0, 0.2, 1)",
+                                                                                "sharp": "cubic-bezier(0.4, 0, 0.6, 1)",
+                                                                              },
+                                                                              "getAutoHeightDuration": [Function],
+                                                                            },
+                                                                            "typography": Object {
+                                                                              "body1": Object {
+                                                                                "fontFamily": "\\"Roboto\\", \\"Helvetica\\", \\"Arial\\", sans-serif",
+                                                                                "fontSize": "1rem",
+                                                                                "fontWeight": 400,
+                                                                                "letterSpacing": "0.00938em",
+                                                                                "lineHeight": 1.5,
+                                                                              },
+                                                                              "body2": Object {
+                                                                                "fontFamily": "\\"Roboto\\", \\"Helvetica\\", \\"Arial\\", sans-serif",
+                                                                                "fontSize": "0.875rem",
+                                                                                "fontWeight": 400,
+                                                                                "letterSpacing": "0.01071em",
+                                                                                "lineHeight": 1.43,
+                                                                              },
+                                                                              "button": Object {
+                                                                                "fontFamily": "\\"Roboto\\", \\"Helvetica\\", \\"Arial\\", sans-serif",
+                                                                                "fontSize": "0.875rem",
+                                                                                "fontWeight": 500,
+                                                                                "letterSpacing": "0.02857em",
+                                                                                "lineHeight": 1.75,
+                                                                                "textTransform": "uppercase",
+                                                                              },
+                                                                              "caption": Object {
+                                                                                "fontFamily": "\\"Roboto\\", \\"Helvetica\\", \\"Arial\\", sans-serif",
+                                                                                "fontSize": "0.75rem",
+                                                                                "fontWeight": 400,
+                                                                                "letterSpacing": "0.03333em",
+                                                                                "lineHeight": 1.66,
+                                                                              },
+                                                                              "fontFamily": "\\"Roboto\\", \\"Helvetica\\", \\"Arial\\", sans-serif",
+                                                                              "fontSize": 14,
+                                                                              "fontWeightBold": 700,
+                                                                              "fontWeightLight": 300,
+                                                                              "fontWeightMedium": 500,
+                                                                              "fontWeightRegular": 400,
+                                                                              "h1": Object {
+                                                                                "fontFamily": "\\"Roboto\\", \\"Helvetica\\", \\"Arial\\", sans-serif",
+                                                                                "fontSize": "6rem",
+                                                                                "fontWeight": 300,
+                                                                                "letterSpacing": "-0.01562em",
+                                                                                "lineHeight": 1,
+                                                                              },
+                                                                              "h2": Object {
+                                                                                "fontFamily": "\\"Roboto\\", \\"Helvetica\\", \\"Arial\\", sans-serif",
+                                                                                "fontSize": "3.75rem",
+                                                                                "fontWeight": 300,
+                                                                                "letterSpacing": "-0.00833em",
+                                                                                "lineHeight": 1,
+                                                                              },
+                                                                              "h3": Object {
+                                                                                "fontFamily": "\\"Roboto\\", \\"Helvetica\\", \\"Arial\\", sans-serif",
+                                                                                "fontSize": "3rem",
+                                                                                "fontWeight": 400,
+                                                                                "letterSpacing": "0em",
+                                                                                "lineHeight": 1.04,
+                                                                              },
+                                                                              "h4": Object {
+                                                                                "fontFamily": "\\"Roboto\\", \\"Helvetica\\", \\"Arial\\", sans-serif",
+                                                                                "fontSize": "2.125rem",
+                                                                                "fontWeight": 400,
+                                                                                "letterSpacing": "0.00735em",
+                                                                                "lineHeight": 1.17,
+                                                                              },
+                                                                              "h5": Object {
+                                                                                "fontFamily": "\\"Roboto\\", \\"Helvetica\\", \\"Arial\\", sans-serif",
+                                                                                "fontSize": "1.5rem",
+                                                                                "fontWeight": 400,
+                                                                                "letterSpacing": "0em",
+                                                                                "lineHeight": 1.33,
+                                                                              },
+                                                                              "h6": Object {
+                                                                                "fontFamily": "\\"Roboto\\", \\"Helvetica\\", \\"Arial\\", sans-serif",
+                                                                                "fontSize": "1.25rem",
+                                                                                "fontWeight": 500,
+                                                                                "letterSpacing": "0.0075em",
+                                                                                "lineHeight": 1.6,
+                                                                              },
+                                                                              "htmlFontSize": 16,
+                                                                              "overline": Object {
+                                                                                "fontFamily": "\\"Roboto\\", \\"Helvetica\\", \\"Arial\\", sans-serif",
+                                                                                "fontSize": "0.75rem",
+                                                                                "fontWeight": 400,
+                                                                                "letterSpacing": "0.08333em",
+                                                                                "lineHeight": 2.66,
+                                                                                "textTransform": "uppercase",
+                                                                              },
+                                                                              "pxToRem": [Function],
+                                                                              "round": [Function],
+                                                                              "subtitle1": Object {
+                                                                                "fontFamily": "\\"Roboto\\", \\"Helvetica\\", \\"Arial\\", sans-serif",
+                                                                                "fontSize": "1rem",
+                                                                                "fontWeight": 400,
+                                                                                "letterSpacing": "0.00938em",
+                                                                                "lineHeight": 1.75,
+                                                                              },
+                                                                              "subtitle2": Object {
+                                                                                "fontFamily": "\\"Roboto\\", \\"Helvetica\\", \\"Arial\\", sans-serif",
+                                                                                "fontSize": "0.875rem",
+                                                                                "fontWeight": 500,
+                                                                                "letterSpacing": "0.00714em",
+                                                                                "lineHeight": 1.57,
+                                                                              },
+                                                                            },
+                                                                            "zIndex": Object {
+                                                                              "appBar": 1100,
+                                                                              "drawer": 1200,
+                                                                              "mobileStepper": 1000,
+                                                                              "modal": 1300,
+                                                                              "snackbar": 1400,
+                                                                              "tooltip": 1500,
+                                                                            },
+                                                                          }
+                                                                        }
+                                                                        variant="body1"
+                                                                      >
+                                                                        <span
+                                                                          className="MuiTypography-root MuiListItemText-primary MuiTypography-body1"
+                                                                        >
+                                                                          New portfolio
+                                                                        </span>
+                                                                      </ForwardRef(Typography)>
+                                                                    </WithStyles(ForwardRef(Typography))>
+                                                                  </div>
+                                                                </ForwardRef(ListItemText)>
+                                                              </WithStyles(ForwardRef(ListItemText))>
+                                                              <NoSsr>
+                                                                <WithStyles(TouchRipple)
+                                                                  center={false}
+                                                                >
+                                                                  <TouchRipple
+                                                                    center={false}
+                                                                    classes={
+                                                                      Object {
+                                                                        "child": "MuiTouchRipple-child",
+                                                                        "childLeaving": "MuiTouchRipple-childLeaving",
+                                                                        "childPulsate": "MuiTouchRipple-childPulsate",
+                                                                        "ripple": "MuiTouchRipple-ripple",
+                                                                        "ripplePulsate": "MuiTouchRipple-ripplePulsate",
+                                                                        "rippleVisible": "MuiTouchRipple-rippleVisible",
+                                                                        "root": "MuiTouchRipple-root",
+                                                                      }
+                                                                    }
+                                                                  >
+                                                                    <span
+                                                                      className="MuiTouchRipple-root"
+                                                                    >
+                                                                      <TransitionGroup
+                                                                        childFactory={[Function]}
+                                                                        component={null}
+                                                                        enter={true}
+                                                                        exit={true}
+                                                                      />
+                                                                    </span>
+                                                                  </TouchRipple>
+                                                                </WithStyles(TouchRipple)>
+                                                              </NoSsr>
+                                                            </div>
+                                                          </ForwardRef(ButtonBase)>
+                                                        </WithStyles(ForwardRef(ButtonBase))>
+                                                      </ForwardRef(ListItem)>
+                                                    </WithStyles(ForwardRef(ListItem))>
+                                                  </MenuItem>
+                                                </WithStyles(MenuItem)>
+                                                <WithStyles(ForwardRef(Divider))
+                                                  key="menu-83.61070"
+                                                >
+                                                  <ForwardRef(Divider)
+                                                    classes={
+                                                      Object {
+                                                        "absolute": "MuiDivider-absolute",
+                                                        "inset": "MuiDivider-inset",
+                                                        "light": "MuiDivider-light",
+                                                        "middle": "MuiDivider-middle",
+                                                        "root": "MuiDivider-root",
+                                                      }
+                                                    }
+                                                  >
+                                                    <hr
+                                                      className="MuiDivider-root"
+                                                    />
+                                                  </ForwardRef(Divider)>
+                                                </WithStyles(ForwardRef(Divider))>
+                                                <WithStyles(MenuItem)
+                                                  icon={
+                                                    Object {
+                                                      "$$typeof": Symbol(react.memo),
+                                                      "compare": null,
+                                                      "displayName": "BugReportIcon",
+                                                      "muiName": "SvgIcon",
+                                                      "type": Object {
+                                                        "$$typeof": Symbol(react.forward_ref),
+                                                        "render": [Function],
+                                                      },
+                                                    }
+                                                  }
+                                                  key="menu-48.44410"
+                                                  redirectTo={[Function]}
+                                                  title="Report a bug"
+                                                  url="/bug"
+                                                >
+                                                  <MenuItem
+                                                    classes={
+                                                      Object {
+                                                        "isDisabled": "MenuItem-isDisabled-128",
+                                                      }
+                                                    }
+                                                    icon={
+                                                      Object {
+                                                        "$$typeof": Symbol(react.memo),
+                                                        "compare": null,
+                                                        "displayName": "BugReportIcon",
+                                                        "muiName": "SvgIcon",
+                                                        "type": Object {
+                                                          "$$typeof": Symbol(react.forward_ref),
+                                                          "render": [Function],
+                                                        },
+                                                      }
+                                                    }
+                                                    isDisabled={false}
+                                                    redirectTo={[Function]}
+                                                    title="Report a bug"
+                                                    url="/bug"
+                                                  >
+                                                    <WithStyles(ForwardRef(ListItem))
+                                                      button={true}
+                                                      className=""
+                                                      onClick={[Function]}
+                                                    >
+                                                      <ForwardRef(ListItem)
+                                                        button={true}
+                                                        className=""
+                                                        classes={
+                                                          Object {
+                                                            "alignItemsFlexStart": "MuiListItem-alignItemsFlexStart",
+                                                            "button": "MuiListItem-button",
+                                                            "container": "MuiListItem-container",
+                                                            "dense": "MuiListItem-dense",
+                                                            "disabled": "Mui-disabled",
+                                                            "divider": "MuiListItem-divider",
+                                                            "focusVisible": "Mui-focusVisible",
+                                                            "gutters": "MuiListItem-gutters",
+                                                            "root": "MuiListItem-root",
+                                                            "secondaryAction": "MuiListItem-secondaryAction",
+                                                            "selected": "Mui-selected",
+                                                          }
+                                                        }
+                                                        onClick={[Function]}
+                                                      >
+                                                        <WithStyles(ForwardRef(ButtonBase))
+                                                          className="MuiListItem-root MuiListItem-gutters MuiListItem-button"
+                                                          component="div"
+                                                          disabled={false}
+                                                          focusVisibleClassName="Mui-focusVisible"
+                                                          onClick={[Function]}
+                                                        >
+                                                          <ForwardRef(ButtonBase)
+                                                            className="MuiListItem-root MuiListItem-gutters MuiListItem-button"
+                                                            classes={
+                                                              Object {
+                                                                "disabled": "Mui-disabled",
+                                                                "focusVisible": "Mui-focusVisible",
+                                                                "root": "MuiButtonBase-root",
+                                                              }
+                                                            }
+                                                            component="div"
+                                                            disabled={false}
+                                                            focusVisibleClassName="Mui-focusVisible"
+                                                            onClick={[Function]}
+                                                          >
+                                                            <div
+                                                              aria-disabled={false}
+                                                              className="MuiButtonBase-root MuiListItem-root MuiListItem-gutters MuiListItem-button"
+                                                              onBlur={[Function]}
+                                                              onClick={[Function]}
+                                                              onFocus={[Function]}
+                                                              onKeyDown={[Function]}
+                                                              onKeyUp={[Function]}
+                                                              onMouseDown={[Function]}
+                                                              onMouseLeave={[Function]}
+                                                              onMouseUp={[Function]}
+                                                              onTouchEnd={[Function]}
+                                                              onTouchMove={[Function]}
+                                                              onTouchStart={[Function]}
+                                                              role="button"
+                                                              tabIndex={0}
+                                                            >
+                                                              <WithStyles(ForwardRef(ListItemIcon))
+                                                                key=".0"
+                                                              >
+                                                                <ForwardRef(ListItemIcon)
+                                                                  classes={
+                                                                    Object {
+                                                                      "root": "MuiListItemIcon-root",
+                                                                    }
+                                                                  }
+                                                                >
+                                                                  <div
+                                                                    className="MuiListItemIcon-root"
+                                                                  >
+                                                                    <ForwardRef>
+                                                                      <WithStyles(ForwardRef(SvgIcon))>
+                                                                        <ForwardRef(SvgIcon)
+                                                                          classes={
+                                                                            Object {
+                                                                              "colorAction": "MuiSvgIcon-colorAction",
+                                                                              "colorDisabled": "MuiSvgIcon-colorDisabled",
+                                                                              "colorError": "MuiSvgIcon-colorError",
+                                                                              "colorPrimary": "MuiSvgIcon-colorPrimary",
+                                                                              "colorSecondary": "MuiSvgIcon-colorSecondary",
+                                                                              "fontSizeInherit": "MuiSvgIcon-fontSizeInherit",
+                                                                              "fontSizeLarge": "MuiSvgIcon-fontSizeLarge",
+                                                                              "fontSizeSmall": "MuiSvgIcon-fontSizeSmall",
+                                                                              "root": "MuiSvgIcon-root",
+                                                                            }
+                                                                          }
+                                                                        >
+                                                                          <svg
+                                                                            aria-hidden="true"
+                                                                            className="MuiSvgIcon-root"
+                                                                            focusable="false"
+                                                                            role="presentation"
+                                                                            viewBox="0 0 24 24"
+                                                                          >
+                                                                            <path
+                                                                              d="M0 0h24v24H0z"
+                                                                              fill="none"
+                                                                            />
+                                                                            <path
+                                                                              d="M20 8h-2.81c-.45-.78-1.07-1.45-1.82-1.96L17 4.41 15.59 3l-2.17 2.17C12.96 5.06 12.49 5 12 5c-.49 0-.96.06-1.41.17L8.41 3 7 4.41l1.62 1.63C7.88 6.55 7.26 7.22 6.81 8H4v2h2.09c-.05.33-.09.66-.09 1v1H4v2h2v1c0 .34.04.67.09 1H4v2h2.81c1.04 1.79 2.97 3 5.19 3s4.15-1.21 5.19-3H20v-2h-2.09c.05-.33.09-.66.09-1v-1h2v-2h-2v-1c0-.34-.04-.67-.09-1H20V8zm-6 8h-4v-2h4v2zm0-4h-4v-2h4v2z"
+                                                                            />
+                                                                          </svg>
+                                                                        </ForwardRef(SvgIcon)>
+                                                                      </WithStyles(ForwardRef(SvgIcon))>
+                                                                    </ForwardRef>
+                                                                  </div>
+                                                                </ForwardRef(ListItemIcon)>
+                                                              </WithStyles(ForwardRef(ListItemIcon))>
+                                                              <WithStyles(ForwardRef(ListItemText))
+                                                                key=".1"
+                                                                primary="Report a bug"
+                                                              >
+                                                                <ForwardRef(ListItemText)
+                                                                  classes={
+                                                                    Object {
+                                                                      "dense": "MuiListItemText-dense",
+                                                                      "inset": "MuiListItemText-inset",
+                                                                      "multiline": "MuiListItemText-multiline",
+                                                                      "primary": "MuiListItemText-primary",
+                                                                      "root": "MuiListItemText-root",
+                                                                      "secondary": "MuiListItemText-secondary",
+                                                                    }
+                                                                  }
+                                                                  primary="Report a bug"
+                                                                >
+                                                                  <div
+                                                                    className="MuiListItemText-root"
+                                                                  >
+                                                                    <WithStyles(ForwardRef(Typography))
+                                                                      className="MuiListItemText-primary"
+                                                                      component="span"
+                                                                      variant="body1"
+                                                                    >
+                                                                      <ForwardRef(Typography)
+                                                                        className="MuiListItemText-primary"
+                                                                        classes={
+                                                                          Object {
+                                                                            "alignCenter": "MuiTypography-alignCenter",
+                                                                            "alignJustify": "MuiTypography-alignJustify",
+                                                                            "alignLeft": "MuiTypography-alignLeft",
+                                                                            "alignRight": "MuiTypography-alignRight",
+                                                                            "body1": "MuiTypography-body1",
+                                                                            "body2": "MuiTypography-body2",
+                                                                            "button": "MuiTypography-button",
+                                                                            "caption": "MuiTypography-caption",
+                                                                            "colorError": "MuiTypography-colorError",
+                                                                            "colorInherit": "MuiTypography-colorInherit",
+                                                                            "colorPrimary": "MuiTypography-colorPrimary",
+                                                                            "colorSecondary": "MuiTypography-colorSecondary",
+                                                                            "colorTextPrimary": "MuiTypography-colorTextPrimary",
+                                                                            "colorTextSecondary": "MuiTypography-colorTextSecondary",
+                                                                            "displayBlock": "MuiTypography-displayBlock",
+                                                                            "displayInline": "MuiTypography-displayInline",
+                                                                            "gutterBottom": "MuiTypography-gutterBottom",
+                                                                            "h1": "MuiTypography-h1",
+                                                                            "h2": "MuiTypography-h2",
+                                                                            "h3": "MuiTypography-h3",
+                                                                            "h4": "MuiTypography-h4",
+                                                                            "h5": "MuiTypography-h5",
+                                                                            "h6": "MuiTypography-h6",
+                                                                            "noWrap": "MuiTypography-noWrap",
+                                                                            "overline": "MuiTypography-overline",
+                                                                            "paragraph": "MuiTypography-paragraph",
+                                                                            "root": "MuiTypography-root",
+                                                                            "srOnly": "MuiTypography-srOnly",
+                                                                            "subtitle1": "MuiTypography-subtitle1",
+                                                                            "subtitle2": "MuiTypography-subtitle2",
+                                                                          }
+                                                                        }
+                                                                        component="span"
+                                                                        theme={
+                                                                          Object {
+                                                                            "breakpoints": Object {
+                                                                              "between": [Function],
+                                                                              "down": [Function],
+                                                                              "keys": Array [
+                                                                                "xs",
+                                                                                "sm",
+                                                                                "md",
+                                                                                "lg",
+                                                                                "xl",
+                                                                              ],
+                                                                              "only": [Function],
+                                                                              "up": [Function],
+                                                                              "values": Object {
+                                                                                "lg": 1280,
+                                                                                "md": 960,
+                                                                                "sm": 600,
+                                                                                "xl": 1920,
+                                                                                "xs": 0,
+                                                                              },
+                                                                              "width": [Function],
+                                                                            },
+                                                                            "direction": "ltr",
+                                                                            "mixins": Object {
+                                                                              "gutters": [Function],
+                                                                              "toolbar": Object {
+                                                                                "@media (min-width:0px) and (orientation: landscape)": Object {
+                                                                                  "minHeight": 48,
+                                                                                },
+                                                                                "@media (min-width:600px)": Object {
+                                                                                  "minHeight": 64,
+                                                                                },
+                                                                                "minHeight": 56,
+                                                                              },
+                                                                            },
+                                                                            "overrides": Object {},
+                                                                            "palette": Object {
+                                                                              "action": Object {
+                                                                                "active": "rgba(0, 0, 0, 0.54)",
+                                                                                "disabled": "rgba(0, 0, 0, 0.26)",
+                                                                                "disabledBackground": "rgba(0, 0, 0, 0.12)",
+                                                                                "hover": "rgba(0, 0, 0, 0.08)",
+                                                                                "hoverOpacity": 0.08,
+                                                                                "selected": "rgba(0, 0, 0, 0.14)",
+                                                                              },
+                                                                              "augmentColor": [Function],
+                                                                              "background": Object {
+                                                                                "default": "#fafafa",
+                                                                                "paper": "#fff",
+                                                                              },
+                                                                              "common": Object {
+                                                                                "black": "#000",
+                                                                                "white": "#fff",
+                                                                              },
+                                                                              "contrastThreshold": 3,
+                                                                              "divider": "rgba(0, 0, 0, 0.12)",
+                                                                              "error": Object {
+                                                                                "contrastText": "#fff",
+                                                                                "dark": "#d32f2f",
+                                                                                "light": "#e57373",
+                                                                                "main": "#f44336",
+                                                                              },
+                                                                              "getContrastText": [Function],
+                                                                              "grey": Object {
+                                                                                "100": "#f5f5f5",
+                                                                                "200": "#eeeeee",
+                                                                                "300": "#e0e0e0",
+                                                                                "400": "#bdbdbd",
+                                                                                "50": "#fafafa",
+                                                                                "500": "#9e9e9e",
+                                                                                "600": "#757575",
+                                                                                "700": "#616161",
+                                                                                "800": "#424242",
+                                                                                "900": "#212121",
+                                                                                "A100": "#d5d5d5",
+                                                                                "A200": "#aaaaaa",
+                                                                                "A400": "#303030",
+                                                                                "A700": "#616161",
+                                                                              },
+                                                                              "primary": Object {
+                                                                                "contrastText": "#fff",
+                                                                                "dark": "#303f9f",
+                                                                                "light": "#7986cb",
+                                                                                "main": "#3f51b5",
+                                                                              },
+                                                                              "secondary": Object {
+                                                                                "contrastText": "#fff",
+                                                                                "dark": "#c51162",
+                                                                                "light": "#ff4081",
+                                                                                "main": "#f50057",
+                                                                              },
+                                                                              "text": Object {
+                                                                                "disabled": "rgba(0, 0, 0, 0.38)",
+                                                                                "hint": "rgba(0, 0, 0, 0.38)",
+                                                                                "primary": "rgba(0, 0, 0, 0.87)",
+                                                                                "secondary": "rgba(0, 0, 0, 0.54)",
+                                                                              },
+                                                                              "tonalOffset": 0.2,
+                                                                              "type": "light",
+                                                                            },
+                                                                            "props": Object {},
+                                                                            "shadows": Array [
+                                                                              "none",
+                                                                              "0px 1px 3px 0px rgba(0,0,0,0.2),0px 1px 1px 0px rgba(0,0,0,0.14),0px 2px 1px -1px rgba(0,0,0,0.12)",
+                                                                              "0px 1px 5px 0px rgba(0,0,0,0.2),0px 2px 2px 0px rgba(0,0,0,0.14),0px 3px 1px -2px rgba(0,0,0,0.12)",
+                                                                              "0px 1px 8px 0px rgba(0,0,0,0.2),0px 3px 4px 0px rgba(0,0,0,0.14),0px 3px 3px -2px rgba(0,0,0,0.12)",
+                                                                              "0px 2px 4px -1px rgba(0,0,0,0.2),0px 4px 5px 0px rgba(0,0,0,0.14),0px 1px 10px 0px rgba(0,0,0,0.12)",
+                                                                              "0px 3px 5px -1px rgba(0,0,0,0.2),0px 5px 8px 0px rgba(0,0,0,0.14),0px 1px 14px 0px rgba(0,0,0,0.12)",
+                                                                              "0px 3px 5px -1px rgba(0,0,0,0.2),0px 6px 10px 0px rgba(0,0,0,0.14),0px 1px 18px 0px rgba(0,0,0,0.12)",
+                                                                              "0px 4px 5px -2px rgba(0,0,0,0.2),0px 7px 10px 1px rgba(0,0,0,0.14),0px 2px 16px 1px rgba(0,0,0,0.12)",
+                                                                              "0px 5px 5px -3px rgba(0,0,0,0.2),0px 8px 10px 1px rgba(0,0,0,0.14),0px 3px 14px 2px rgba(0,0,0,0.12)",
+                                                                              "0px 5px 6px -3px rgba(0,0,0,0.2),0px 9px 12px 1px rgba(0,0,0,0.14),0px 3px 16px 2px rgba(0,0,0,0.12)",
+                                                                              "0px 6px 6px -3px rgba(0,0,0,0.2),0px 10px 14px 1px rgba(0,0,0,0.14),0px 4px 18px 3px rgba(0,0,0,0.12)",
+                                                                              "0px 6px 7px -4px rgba(0,0,0,0.2),0px 11px 15px 1px rgba(0,0,0,0.14),0px 4px 20px 3px rgba(0,0,0,0.12)",
+                                                                              "0px 7px 8px -4px rgba(0,0,0,0.2),0px 12px 17px 2px rgba(0,0,0,0.14),0px 5px 22px 4px rgba(0,0,0,0.12)",
+                                                                              "0px 7px 8px -4px rgba(0,0,0,0.2),0px 13px 19px 2px rgba(0,0,0,0.14),0px 5px 24px 4px rgba(0,0,0,0.12)",
+                                                                              "0px 7px 9px -4px rgba(0,0,0,0.2),0px 14px 21px 2px rgba(0,0,0,0.14),0px 5px 26px 4px rgba(0,0,0,0.12)",
+                                                                              "0px 8px 9px -5px rgba(0,0,0,0.2),0px 15px 22px 2px rgba(0,0,0,0.14),0px 6px 28px 5px rgba(0,0,0,0.12)",
+                                                                              "0px 8px 10px -5px rgba(0,0,0,0.2),0px 16px 24px 2px rgba(0,0,0,0.14),0px 6px 30px 5px rgba(0,0,0,0.12)",
+                                                                              "0px 8px 11px -5px rgba(0,0,0,0.2),0px 17px 26px 2px rgba(0,0,0,0.14),0px 6px 32px 5px rgba(0,0,0,0.12)",
+                                                                              "0px 9px 11px -5px rgba(0,0,0,0.2),0px 18px 28px 2px rgba(0,0,0,0.14),0px 7px 34px 6px rgba(0,0,0,0.12)",
+                                                                              "0px 9px 12px -6px rgba(0,0,0,0.2),0px 19px 29px 2px rgba(0,0,0,0.14),0px 7px 36px 6px rgba(0,0,0,0.12)",
+                                                                              "0px 10px 13px -6px rgba(0,0,0,0.2),0px 20px 31px 3px rgba(0,0,0,0.14),0px 8px 38px 7px rgba(0,0,0,0.12)",
+                                                                              "0px 10px 13px -6px rgba(0,0,0,0.2),0px 21px 33px 3px rgba(0,0,0,0.14),0px 8px 40px 7px rgba(0,0,0,0.12)",
+                                                                              "0px 10px 14px -6px rgba(0,0,0,0.2),0px 22px 35px 3px rgba(0,0,0,0.14),0px 8px 42px 7px rgba(0,0,0,0.12)",
+                                                                              "0px 11px 14px -7px rgba(0,0,0,0.2),0px 23px 36px 3px rgba(0,0,0,0.14),0px 9px 44px 8px rgba(0,0,0,0.12)",
+                                                                              "0px 11px 15px -7px rgba(0,0,0,0.2),0px 24px 38px 3px rgba(0,0,0,0.14),0px 9px 46px 8px rgba(0,0,0,0.12)",
+                                                                            ],
+                                                                            "shape": Object {
+                                                                              "borderRadius": 4,
+                                                                            },
+                                                                            "spacing": [Function],
+                                                                            "transitions": Object {
+                                                                              "create": [Function],
+                                                                              "duration": Object {
+                                                                                "complex": 375,
+                                                                                "enteringScreen": 225,
+                                                                                "leavingScreen": 195,
+                                                                                "short": 250,
+                                                                                "shorter": 200,
+                                                                                "shortest": 150,
+                                                                                "standard": 300,
+                                                                              },
+                                                                              "easing": Object {
+                                                                                "easeIn": "cubic-bezier(0.4, 0, 1, 1)",
+                                                                                "easeInOut": "cubic-bezier(0.4, 0, 0.2, 1)",
+                                                                                "easeOut": "cubic-bezier(0.0, 0, 0.2, 1)",
+                                                                                "sharp": "cubic-bezier(0.4, 0, 0.6, 1)",
+                                                                              },
+                                                                              "getAutoHeightDuration": [Function],
+                                                                            },
+                                                                            "typography": Object {
+                                                                              "body1": Object {
+                                                                                "fontFamily": "\\"Roboto\\", \\"Helvetica\\", \\"Arial\\", sans-serif",
+                                                                                "fontSize": "1rem",
+                                                                                "fontWeight": 400,
+                                                                                "letterSpacing": "0.00938em",
+                                                                                "lineHeight": 1.5,
+                                                                              },
+                                                                              "body2": Object {
+                                                                                "fontFamily": "\\"Roboto\\", \\"Helvetica\\", \\"Arial\\", sans-serif",
+                                                                                "fontSize": "0.875rem",
+                                                                                "fontWeight": 400,
+                                                                                "letterSpacing": "0.01071em",
+                                                                                "lineHeight": 1.43,
+                                                                              },
+                                                                              "button": Object {
+                                                                                "fontFamily": "\\"Roboto\\", \\"Helvetica\\", \\"Arial\\", sans-serif",
+                                                                                "fontSize": "0.875rem",
+                                                                                "fontWeight": 500,
+                                                                                "letterSpacing": "0.02857em",
+                                                                                "lineHeight": 1.75,
+                                                                                "textTransform": "uppercase",
+                                                                              },
+                                                                              "caption": Object {
+                                                                                "fontFamily": "\\"Roboto\\", \\"Helvetica\\", \\"Arial\\", sans-serif",
+                                                                                "fontSize": "0.75rem",
+                                                                                "fontWeight": 400,
+                                                                                "letterSpacing": "0.03333em",
+                                                                                "lineHeight": 1.66,
+                                                                              },
+                                                                              "fontFamily": "\\"Roboto\\", \\"Helvetica\\", \\"Arial\\", sans-serif",
+                                                                              "fontSize": 14,
+                                                                              "fontWeightBold": 700,
+                                                                              "fontWeightLight": 300,
+                                                                              "fontWeightMedium": 500,
+                                                                              "fontWeightRegular": 400,
+                                                                              "h1": Object {
+                                                                                "fontFamily": "\\"Roboto\\", \\"Helvetica\\", \\"Arial\\", sans-serif",
+                                                                                "fontSize": "6rem",
+                                                                                "fontWeight": 300,
+                                                                                "letterSpacing": "-0.01562em",
+                                                                                "lineHeight": 1,
+                                                                              },
+                                                                              "h2": Object {
+                                                                                "fontFamily": "\\"Roboto\\", \\"Helvetica\\", \\"Arial\\", sans-serif",
+                                                                                "fontSize": "3.75rem",
+                                                                                "fontWeight": 300,
+                                                                                "letterSpacing": "-0.00833em",
+                                                                                "lineHeight": 1,
+                                                                              },
+                                                                              "h3": Object {
+                                                                                "fontFamily": "\\"Roboto\\", \\"Helvetica\\", \\"Arial\\", sans-serif",
+                                                                                "fontSize": "3rem",
+                                                                                "fontWeight": 400,
+                                                                                "letterSpacing": "0em",
+                                                                                "lineHeight": 1.04,
+                                                                              },
+                                                                              "h4": Object {
+                                                                                "fontFamily": "\\"Roboto\\", \\"Helvetica\\", \\"Arial\\", sans-serif",
+                                                                                "fontSize": "2.125rem",
+                                                                                "fontWeight": 400,
+                                                                                "letterSpacing": "0.00735em",
+                                                                                "lineHeight": 1.17,
+                                                                              },
+                                                                              "h5": Object {
+                                                                                "fontFamily": "\\"Roboto\\", \\"Helvetica\\", \\"Arial\\", sans-serif",
+                                                                                "fontSize": "1.5rem",
+                                                                                "fontWeight": 400,
+                                                                                "letterSpacing": "0em",
+                                                                                "lineHeight": 1.33,
+                                                                              },
+                                                                              "h6": Object {
+                                                                                "fontFamily": "\\"Roboto\\", \\"Helvetica\\", \\"Arial\\", sans-serif",
+                                                                                "fontSize": "1.25rem",
+                                                                                "fontWeight": 500,
+                                                                                "letterSpacing": "0.0075em",
+                                                                                "lineHeight": 1.6,
+                                                                              },
+                                                                              "htmlFontSize": 16,
+                                                                              "overline": Object {
+                                                                                "fontFamily": "\\"Roboto\\", \\"Helvetica\\", \\"Arial\\", sans-serif",
+                                                                                "fontSize": "0.75rem",
+                                                                                "fontWeight": 400,
+                                                                                "letterSpacing": "0.08333em",
+                                                                                "lineHeight": 2.66,
+                                                                                "textTransform": "uppercase",
+                                                                              },
+                                                                              "pxToRem": [Function],
+                                                                              "round": [Function],
+                                                                              "subtitle1": Object {
+                                                                                "fontFamily": "\\"Roboto\\", \\"Helvetica\\", \\"Arial\\", sans-serif",
+                                                                                "fontSize": "1rem",
+                                                                                "fontWeight": 400,
+                                                                                "letterSpacing": "0.00938em",
+                                                                                "lineHeight": 1.75,
+                                                                              },
+                                                                              "subtitle2": Object {
+                                                                                "fontFamily": "\\"Roboto\\", \\"Helvetica\\", \\"Arial\\", sans-serif",
+                                                                                "fontSize": "0.875rem",
+                                                                                "fontWeight": 500,
+                                                                                "letterSpacing": "0.00714em",
+                                                                                "lineHeight": 1.57,
+                                                                              },
+                                                                            },
+                                                                            "zIndex": Object {
+                                                                              "appBar": 1100,
+                                                                              "drawer": 1200,
+                                                                              "mobileStepper": 1000,
+                                                                              "modal": 1300,
+                                                                              "snackbar": 1400,
+                                                                              "tooltip": 1500,
+                                                                            },
+                                                                          }
+                                                                        }
+                                                                        variant="body1"
+                                                                      >
+                                                                        <span
+                                                                          className="MuiTypography-root MuiListItemText-primary MuiTypography-body1"
+                                                                        >
+                                                                          Report a bug
+                                                                        </span>
+                                                                      </ForwardRef(Typography)>
+                                                                    </WithStyles(ForwardRef(Typography))>
+                                                                  </div>
+                                                                </ForwardRef(ListItemText)>
+                                                              </WithStyles(ForwardRef(ListItemText))>
+                                                              <NoSsr>
+                                                                <WithStyles(TouchRipple)
+                                                                  center={false}
+                                                                >
+                                                                  <TouchRipple
+                                                                    center={false}
+                                                                    classes={
+                                                                      Object {
+                                                                        "child": "MuiTouchRipple-child",
+                                                                        "childLeaving": "MuiTouchRipple-childLeaving",
+                                                                        "childPulsate": "MuiTouchRipple-childPulsate",
+                                                                        "ripple": "MuiTouchRipple-ripple",
+                                                                        "ripplePulsate": "MuiTouchRipple-ripplePulsate",
+                                                                        "rippleVisible": "MuiTouchRipple-rippleVisible",
+                                                                        "root": "MuiTouchRipple-root",
+                                                                      }
+                                                                    }
+                                                                  >
+                                                                    <span
+                                                                      className="MuiTouchRipple-root"
+                                                                    >
+                                                                      <TransitionGroup
+                                                                        childFactory={[Function]}
+                                                                        component={null}
+                                                                        enter={true}
+                                                                        exit={true}
+                                                                      />
+                                                                    </span>
+                                                                  </TouchRipple>
+                                                                </WithStyles(TouchRipple)>
+                                                              </NoSsr>
+                                                            </div>
+                                                          </ForwardRef(ButtonBase)>
+                                                        </WithStyles(ForwardRef(ButtonBase))>
+                                                      </ForwardRef(ListItem)>
+                                                    </WithStyles(ForwardRef(ListItem))>
+                                                  </MenuItem>
+                                                </WithStyles(MenuItem)>
+                                              </ul>
+                                            </ForwardRef(List)>
+                                          </WithStyles(ForwardRef(List))>
+                                        </div>
+                                      </Menu>
+                                    </WithStyles(Menu)>
+                                  </div>
+                                </div>
+                              </ForwardRef(Paper)>
+                            </WithStyles(ForwardRef(Paper))>
+                          </Transition>
+                        </ForwardRef(Slide)>
+                      </WithTheme(ForwardRef(Slide))>
+                    </div>
+                  </ForwardRef(Drawer)>
+                </WithStyles(ForwardRef(Drawer))>
+              </Drawer>
+            </WithStyles(Drawer)>
+            <main
+              className="BaseBranch-content-3 BaseBranch-contentShift-4"
+            >
+              <WithStyles(CookieInfo)
+                hasCookieInfo={true}
+                isOpen={false}
+                key=".0"
+                menuOpen={true}
+                onAccept={[Function]}
+              >
+                <CookieInfo
+                  buttonText="Accept"
+                  classes={
+                    Object {
+                      "button": "CookieInfo-button-160",
+                      "content": "CookieInfo-content-159",
+                      "root": "CookieInfo-root-157",
+                      "rootActive": "CookieInfo-rootActive-158",
+                    }
+                  }
+                  hasCookieInfo={true}
+                  isOpen={false}
+                  menuOpen={true}
+                  onAccept={[Function]}
+                >
+                  <div
+                    className="CookieInfo-root-157"
+                  >
+                    <div
+                      className="CookieInfo-content-159"
+                    />
+                    <WithStyles(ForwardRef(Button))
+                      className="CookieInfo-button-160"
+                      onClick={[Function]}
+                    >
+                      <ForwardRef(Button)
+                        className="CookieInfo-button-160"
+                        classes={
+                          Object {
+                            "colorInherit": "MuiButton-colorInherit",
+                            "contained": "MuiButton-contained",
+                            "containedPrimary": "MuiButton-containedPrimary",
+                            "containedSecondary": "MuiButton-containedSecondary",
+                            "disabled": "Mui-disabled",
+                            "focusVisible": "Mui-focusVisible",
+                            "fullWidth": "MuiButton-fullWidth",
+                            "label": "MuiButton-label",
+                            "outlined": "MuiButton-outlined",
+                            "outlinedPrimary": "MuiButton-outlinedPrimary",
+                            "outlinedSecondary": "MuiButton-outlinedSecondary",
+                            "root": "MuiButton-root",
+                            "sizeLarge": "MuiButton-sizeLarge",
+                            "sizeSmall": "MuiButton-sizeSmall",
+                            "text": "MuiButton-text",
+                            "textPrimary": "MuiButton-textPrimary",
+                            "textSecondary": "MuiButton-textSecondary",
+                          }
+                        }
+                        onClick={[Function]}
+                      >
+                        <WithStyles(ForwardRef(ButtonBase))
+                          className="MuiButton-root CookieInfo-button-160 MuiButton-text"
+                          component="button"
+                          disabled={false}
+                          focusRipple={true}
+                          focusVisibleClassName="Mui-focusVisible"
+                          onClick={[Function]}
+                          type="button"
+                        >
+                          <ForwardRef(ButtonBase)
+                            className="MuiButton-root CookieInfo-button-160 MuiButton-text"
+                            classes={
+                              Object {
+                                "disabled": "Mui-disabled",
+                                "focusVisible": "Mui-focusVisible",
+                                "root": "MuiButtonBase-root",
+                              }
+                            }
+                            component="button"
+                            disabled={false}
+                            focusRipple={true}
+                            focusVisibleClassName="Mui-focusVisible"
+                            onClick={[Function]}
+                            type="button"
+                          >
+                            <button
+                              className="MuiButtonBase-root MuiButton-root CookieInfo-button-160 MuiButton-text"
+                              disabled={false}
+                              onBlur={[Function]}
+                              onClick={[Function]}
+                              onFocus={[Function]}
+                              onKeyDown={[Function]}
+                              onKeyUp={[Function]}
+                              onMouseDown={[Function]}
+                              onMouseLeave={[Function]}
+                              onMouseUp={[Function]}
+                              onTouchEnd={[Function]}
+                              onTouchMove={[Function]}
+                              onTouchStart={[Function]}
+                              tabIndex={0}
+                              type="button"
+                            >
+                              <span
+                                className="MuiButton-label"
+                              >
+                                Accept
+                              </span>
+                              <NoSsr>
+                                <WithStyles(TouchRipple)
+                                  center={false}
+                                >
+                                  <TouchRipple
+                                    center={false}
+                                    classes={
+                                      Object {
+                                        "child": "MuiTouchRipple-child",
+                                        "childLeaving": "MuiTouchRipple-childLeaving",
+                                        "childPulsate": "MuiTouchRipple-childPulsate",
+                                        "ripple": "MuiTouchRipple-ripple",
+                                        "ripplePulsate": "MuiTouchRipple-ripplePulsate",
+                                        "rippleVisible": "MuiTouchRipple-rippleVisible",
+                                        "root": "MuiTouchRipple-root",
+                                      }
+                                    }
+                                  >
+                                    <span
+                                      className="MuiTouchRipple-root"
+                                    >
+                                      <TransitionGroup
+                                        childFactory={[Function]}
+                                        component={null}
+                                        enter={true}
+                                        exit={true}
+                                      />
+                                    </span>
+                                  </TouchRipple>
+                                </WithStyles(TouchRipple)>
+                              </NoSsr>
+                            </button>
+                          </ForwardRef(ButtonBase)>
+                        </WithStyles(ForwardRef(ButtonBase))>
+                      </ForwardRef(Button)>
+                    </WithStyles(ForwardRef(Button))>
+                  </div>
+                </CookieInfo>
+              </WithStyles(CookieInfo)>
+              <div
+                hasCookieInfo={true}
+                isOpen={false}
+                key=".1"
+                menuOpen={true}
+                onAccept={[Function]}
+              >
+                Foo
               </div>
-              <hr
-                className="MuiDivider-root-113"
-              />
+            </main>
+          </div>
+        </div>
+      </BaseBranch>
+    </WithStyles(BaseBranch)>
+  </_class>
+</MockRouter>
+`;
+
+exports[`Base click on menu icon if closed changes state 1`] = `
+<MockRouter
+  createHref={[Function]}
+  location=""
+  params={Object {}}
+  path=""
+  push={[Function]}
+  replace={[Function]}
+  url=""
+>
+  <_class
+    hasCookieInfo={true}
+    hasHeader={true}
+    isHeaderFixed={true}
+    isOpen={false}
+    menuData={
+      Array [
+        Object {
+          "icon": null,
+          "title": "Dashboard",
+          "type": "link",
+          "url": "/",
+        },
+        Object {
+          "isDisabled": true,
+          "title": "New portfolio",
+          "type": "link",
+          "url": "/portfolio",
+        },
+        Object {
+          "type": "divider",
+        },
+        Object {
+          "icon": Object {
+            "$$typeof": Symbol(react.memo),
+            "compare": null,
+            "displayName": "BugReportIcon",
+            "muiName": "SvgIcon",
+            "type": Object {
+              "$$typeof": Symbol(react.forward_ref),
+              "render": [Function],
+            },
+          },
+          "title": "Report a bug",
+          "type": "link",
+          "url": "/bug",
+        },
+      ]
+    }
+    menuOpen={true}
+    rightContent={null}
+    title="Foo"
+  >
+    <WithStyles(BaseBranch)
+      cookieInfoOpen={true}
+      handleDrawerClose={[Function]}
+      handleDrawerOpen={[Function]}
+      hasCookieInfo={true}
+      hasHeader={true}
+      isHeaderFixed={true}
+      isOpen={false}
+      menuData={
+        Array [
+          Object {
+            "icon": null,
+            "title": "Dashboard",
+            "type": "link",
+            "url": "/",
+          },
+          Object {
+            "isDisabled": true,
+            "title": "New portfolio",
+            "type": "link",
+            "url": "/portfolio",
+          },
+          Object {
+            "type": "divider",
+          },
+          Object {
+            "icon": Object {
+              "$$typeof": Symbol(react.memo),
+              "compare": null,
+              "displayName": "BugReportIcon",
+              "muiName": "SvgIcon",
+              "type": Object {
+                "$$typeof": Symbol(react.forward_ref),
+                "render": [Function],
+              },
+            },
+            "title": "Report a bug",
+            "type": "link",
+            "url": "/bug",
+          },
+        ]
+      }
+      menuOpen={true}
+      onClick={[Function]}
+      onCookieInfoAccept={[Function]}
+      open={false}
+      redirectTo={[Function]}
+      rightContent={null}
+      title="Foo"
+    >
+      <BaseBranch
+        classes={
+          Object {
+            "appFrame": "BaseBranch-appFrame-1",
+            "appFrameWithCookieInfo": "BaseBranch-appFrameWithCookieInfo-2",
+            "content": "BaseBranch-content-3",
+            "contentShift": "BaseBranch-contentShift-4",
+          }
+        }
+        cookieInfoOpen={true}
+        handleDrawerClose={[Function]}
+        handleDrawerOpen={[Function]}
+        hasCookieInfo={true}
+        hasHeader={true}
+        isHeaderFixed={true}
+        isOpen={false}
+        menuData={
+          Array [
+            Object {
+              "icon": null,
+              "title": "Dashboard",
+              "type": "link",
+              "url": "/",
+            },
+            Object {
+              "isDisabled": true,
+              "title": "New portfolio",
+              "type": "link",
+              "url": "/portfolio",
+            },
+            Object {
+              "type": "divider",
+            },
+            Object {
+              "icon": Object {
+                "$$typeof": Symbol(react.memo),
+                "compare": null,
+                "displayName": "BugReportIcon",
+                "muiName": "SvgIcon",
+                "type": Object {
+                  "$$typeof": Symbol(react.forward_ref),
+                  "render": [Function],
+                },
+              },
+              "title": "Report a bug",
+              "type": "link",
+              "url": "/bug",
+            },
+          ]
+        }
+        menuOpen={true}
+        onClick={[Function]}
+        onCookieInfoAccept={[Function]}
+        open={false}
+        redirectTo={[Function]}
+        rightContent={null}
+        title="Foo"
+      >
+        <div>
+          <WithStyles(Header)
+            isCookieInfoOpen={true}
+            isFixed={true}
+            isOpen={false}
+            onClick={[Function]}
+            onDrawerOpen={[Function]}
+            title="Foo"
+          >
+            <Header
+              classes={
+                Object {
+                  "appBar": "Header-appBar-6",
+                  "appBarShift": "Header-appBarShift-8",
+                  "appBarWithCookieInfo": "Header-appBarWithCookieInfo-7",
+                  "flex": "Header-flex-11",
+                  "hide": "Header-hide-10",
+                  "menuButton": "Header-menuButton-9",
+                  "root": "Header-root-5",
+                  "title": "Header-title-12",
+                }
+              }
+              isCookieInfoOpen={true}
+              isFixed={true}
+              isOpen={false}
+              onClick={[Function]}
+              onDrawerOpen={[Function]}
+              title="Foo"
+            >
               <div
-                className="MuiButtonBase-root-58 MuiListItem-root-123 MuiListItem-default-126 MuiListItem-gutters-130 MuiListItem-button-131"
-                onBlur={[Function]}
-                onClick={[Function]}
-                onFocus={[Function]}
-                onKeyDown={[Function]}
-                onKeyUp={[Function]}
-                onMouseDown={[Function]}
-                onMouseLeave={[Function]}
-                onMouseUp={[Function]}
-                onTouchEnd={[Function]}
-                onTouchMove={[Function]}
-                onTouchStart={[Function]}
-                role="button"
-                tabIndex="0"
+                className="Header-root-5"
               >
-                <svg
-                  aria-hidden="true"
-                  className="MuiSvgIcon-root-61 MuiListItemIcon-root-140"
-                  focusable="false"
-                  viewBox="0 0 24 24"
+                <WithStyles(ForwardRef(AppBar))
+                  className="Header-appBar-6 Header-appBarWithCookieInfo-7"
+                  position="fixed"
                 >
-                  <path
-                    d="M0 0h24v24H0z"
-                    fill="none"
-                  />
-                  <path
-                    d="M20 8h-2.81c-.45-.78-1.07-1.45-1.82-1.96L17 4.41 15.59 3l-2.17 2.17C12.96 5.06 12.49 5 12 5c-.49 0-.96.06-1.41.17L8.41 3 7 4.41l1.62 1.63C7.88 6.55 7.26 7.22 6.81 8H4v2h2.09c-.05.33-.09.66-.09 1v1H4v2h2v1c0 .34.04.67.09 1H4v2h2.81c1.04 1.79 2.97 3 5.19 3s4.15-1.21 5.19-3H20v-2h-2.09c.05-.33.09-.66.09-1v-1h2v-2h-2v-1c0-.34-.04-.67-.09-1H20V8zm-6 8h-4v-2h4v2zm0-4h-4v-2h4v2z"
-                  />
-                </svg>
-                <div
-                  className="MuiListItemText-root-134"
+                  <ForwardRef(AppBar)
+                    className="Header-appBar-6 Header-appBarWithCookieInfo-7"
+                    classes={
+                      Object {
+                        "colorDefault": "MuiAppBar-colorDefault",
+                        "colorPrimary": "MuiAppBar-colorPrimary",
+                        "colorSecondary": "MuiAppBar-colorSecondary",
+                        "positionAbsolute": "MuiAppBar-positionAbsolute",
+                        "positionFixed": "MuiAppBar-positionFixed",
+                        "positionRelative": "MuiAppBar-positionRelative",
+                        "positionStatic": "MuiAppBar-positionStatic",
+                        "positionSticky": "MuiAppBar-positionSticky",
+                        "root": "MuiAppBar-root",
+                      }
+                    }
+                    position="fixed"
+                  >
+                    <WithStyles(ForwardRef(Paper))
+                      className="MuiAppBar-root MuiAppBar-positionFixed Header-appBar-6 Header-appBarWithCookieInfo-7 MuiAppBar-colorPrimary mui-fixed"
+                      component="header"
+                      elevation={4}
+                      square={true}
+                    >
+                      <ForwardRef(Paper)
+                        className="MuiAppBar-root MuiAppBar-positionFixed Header-appBar-6 Header-appBarWithCookieInfo-7 MuiAppBar-colorPrimary mui-fixed"
+                        classes={
+                          Object {
+                            "elevation0": "MuiPaper-elevation0",
+                            "elevation1": "MuiPaper-elevation1",
+                            "elevation10": "MuiPaper-elevation10",
+                            "elevation11": "MuiPaper-elevation11",
+                            "elevation12": "MuiPaper-elevation12",
+                            "elevation13": "MuiPaper-elevation13",
+                            "elevation14": "MuiPaper-elevation14",
+                            "elevation15": "MuiPaper-elevation15",
+                            "elevation16": "MuiPaper-elevation16",
+                            "elevation17": "MuiPaper-elevation17",
+                            "elevation18": "MuiPaper-elevation18",
+                            "elevation19": "MuiPaper-elevation19",
+                            "elevation2": "MuiPaper-elevation2",
+                            "elevation20": "MuiPaper-elevation20",
+                            "elevation21": "MuiPaper-elevation21",
+                            "elevation22": "MuiPaper-elevation22",
+                            "elevation23": "MuiPaper-elevation23",
+                            "elevation24": "MuiPaper-elevation24",
+                            "elevation3": "MuiPaper-elevation3",
+                            "elevation4": "MuiPaper-elevation4",
+                            "elevation5": "MuiPaper-elevation5",
+                            "elevation6": "MuiPaper-elevation6",
+                            "elevation7": "MuiPaper-elevation7",
+                            "elevation8": "MuiPaper-elevation8",
+                            "elevation9": "MuiPaper-elevation9",
+                            "root": "MuiPaper-root",
+                            "rounded": "MuiPaper-rounded",
+                          }
+                        }
+                        component="header"
+                        elevation={4}
+                        square={true}
+                      >
+                        <header
+                          className="MuiPaper-root MuiPaper-elevation4 MuiAppBar-root MuiAppBar-positionFixed Header-appBar-6 Header-appBarWithCookieInfo-7 MuiAppBar-colorPrimary mui-fixed"
+                        >
+                          <WithStyles(ForwardRef(Toolbar))>
+                            <ForwardRef(Toolbar)
+                              classes={
+                                Object {
+                                  "dense": "MuiToolbar-dense",
+                                  "gutters": "MuiToolbar-gutters",
+                                  "regular": "MuiToolbar-regular",
+                                  "root": "MuiToolbar-root",
+                                }
+                              }
+                            >
+                              <div
+                                className="MuiToolbar-root MuiToolbar-regular MuiToolbar-gutters"
+                              >
+                                <WithStyles(ForwardRef(IconButton))
+                                  aria-label="open drawer"
+                                  className="Header-menuButton-9"
+                                  color="inherit"
+                                  onClick={[Function]}
+                                >
+                                  <ForwardRef(IconButton)
+                                    aria-label="open drawer"
+                                    className="Header-menuButton-9"
+                                    classes={
+                                      Object {
+                                        "colorInherit": "MuiIconButton-colorInherit",
+                                        "colorPrimary": "MuiIconButton-colorPrimary",
+                                        "colorSecondary": "MuiIconButton-colorSecondary",
+                                        "disabled": "Mui-disabled",
+                                        "edgeEnd": "MuiIconButton-edgeEnd",
+                                        "edgeStart": "MuiIconButton-edgeStart",
+                                        "label": "MuiIconButton-label",
+                                        "root": "MuiIconButton-root",
+                                        "sizeSmall": "MuiIconButton-sizeSmall",
+                                      }
+                                    }
+                                    color="inherit"
+                                    onClick={[Function]}
+                                  >
+                                    <WithStyles(ForwardRef(ButtonBase))
+                                      aria-label="open drawer"
+                                      centerRipple={true}
+                                      className="MuiIconButton-root Header-menuButton-9 MuiIconButton-colorInherit"
+                                      disabled={false}
+                                      focusRipple={true}
+                                      onClick={[Function]}
+                                    >
+                                      <ForwardRef(ButtonBase)
+                                        aria-label="open drawer"
+                                        centerRipple={true}
+                                        className="MuiIconButton-root Header-menuButton-9 MuiIconButton-colorInherit"
+                                        classes={
+                                          Object {
+                                            "disabled": "Mui-disabled",
+                                            "focusVisible": "Mui-focusVisible",
+                                            "root": "MuiButtonBase-root",
+                                          }
+                                        }
+                                        disabled={false}
+                                        focusRipple={true}
+                                        onClick={[Function]}
+                                      >
+                                        <button
+                                          aria-label="open drawer"
+                                          className="MuiButtonBase-root MuiIconButton-root Header-menuButton-9 MuiIconButton-colorInherit"
+                                          disabled={false}
+                                          onBlur={[Function]}
+                                          onClick={[Function]}
+                                          onFocus={[Function]}
+                                          onKeyDown={[Function]}
+                                          onKeyUp={[Function]}
+                                          onMouseDown={[Function]}
+                                          onMouseLeave={[Function]}
+                                          onMouseUp={[Function]}
+                                          onTouchEnd={[Function]}
+                                          onTouchMove={[Function]}
+                                          onTouchStart={[Function]}
+                                          tabIndex={0}
+                                          type="button"
+                                        >
+                                          <span
+                                            className="MuiIconButton-label"
+                                          >
+                                            <ForwardRef>
+                                              <WithStyles(ForwardRef(SvgIcon))>
+                                                <ForwardRef(SvgIcon)
+                                                  classes={
+                                                    Object {
+                                                      "colorAction": "MuiSvgIcon-colorAction",
+                                                      "colorDisabled": "MuiSvgIcon-colorDisabled",
+                                                      "colorError": "MuiSvgIcon-colorError",
+                                                      "colorPrimary": "MuiSvgIcon-colorPrimary",
+                                                      "colorSecondary": "MuiSvgIcon-colorSecondary",
+                                                      "fontSizeInherit": "MuiSvgIcon-fontSizeInherit",
+                                                      "fontSizeLarge": "MuiSvgIcon-fontSizeLarge",
+                                                      "fontSizeSmall": "MuiSvgIcon-fontSizeSmall",
+                                                      "root": "MuiSvgIcon-root",
+                                                    }
+                                                  }
+                                                >
+                                                  <svg
+                                                    aria-hidden="true"
+                                                    className="MuiSvgIcon-root"
+                                                    focusable="false"
+                                                    role="presentation"
+                                                    viewBox="0 0 24 24"
+                                                  >
+                                                    <path
+                                                      d="M0 0h24v24H0z"
+                                                      fill="none"
+                                                    />
+                                                    <path
+                                                      d="M3 18h18v-2H3v2zm0-5h18v-2H3v2zm0-7v2h18V6H3z"
+                                                    />
+                                                  </svg>
+                                                </ForwardRef(SvgIcon)>
+                                              </WithStyles(ForwardRef(SvgIcon))>
+                                            </ForwardRef>
+                                          </span>
+                                          <NoSsr>
+                                            <WithStyles(TouchRipple)
+                                              center={true}
+                                            >
+                                              <TouchRipple
+                                                center={true}
+                                                classes={
+                                                  Object {
+                                                    "child": "MuiTouchRipple-child",
+                                                    "childLeaving": "MuiTouchRipple-childLeaving",
+                                                    "childPulsate": "MuiTouchRipple-childPulsate",
+                                                    "ripple": "MuiTouchRipple-ripple",
+                                                    "ripplePulsate": "MuiTouchRipple-ripplePulsate",
+                                                    "rippleVisible": "MuiTouchRipple-rippleVisible",
+                                                    "root": "MuiTouchRipple-root",
+                                                  }
+                                                }
+                                              >
+                                                <span
+                                                  className="MuiTouchRipple-root"
+                                                >
+                                                  <TransitionGroup
+                                                    childFactory={[Function]}
+                                                    component={null}
+                                                    enter={true}
+                                                    exit={true}
+                                                  />
+                                                </span>
+                                              </TouchRipple>
+                                            </WithStyles(TouchRipple)>
+                                          </NoSsr>
+                                        </button>
+                                      </ForwardRef(ButtonBase)>
+                                    </WithStyles(ForwardRef(ButtonBase))>
+                                  </ForwardRef(IconButton)>
+                                </WithStyles(ForwardRef(IconButton))>
+                                <WithStyles(ForwardRef(Typography))
+                                  className="Header-flex-11 Header-title-12"
+                                  color="inherit"
+                                  onClick={[Function]}
+                                  variant="h6"
+                                >
+                                  <ForwardRef(Typography)
+                                    className="Header-flex-11 Header-title-12"
+                                    classes={
+                                      Object {
+                                        "alignCenter": "MuiTypography-alignCenter",
+                                        "alignJustify": "MuiTypography-alignJustify",
+                                        "alignLeft": "MuiTypography-alignLeft",
+                                        "alignRight": "MuiTypography-alignRight",
+                                        "body1": "MuiTypography-body1",
+                                        "body2": "MuiTypography-body2",
+                                        "button": "MuiTypography-button",
+                                        "caption": "MuiTypography-caption",
+                                        "colorError": "MuiTypography-colorError",
+                                        "colorInherit": "MuiTypography-colorInherit",
+                                        "colorPrimary": "MuiTypography-colorPrimary",
+                                        "colorSecondary": "MuiTypography-colorSecondary",
+                                        "colorTextPrimary": "MuiTypography-colorTextPrimary",
+                                        "colorTextSecondary": "MuiTypography-colorTextSecondary",
+                                        "displayBlock": "MuiTypography-displayBlock",
+                                        "displayInline": "MuiTypography-displayInline",
+                                        "gutterBottom": "MuiTypography-gutterBottom",
+                                        "h1": "MuiTypography-h1",
+                                        "h2": "MuiTypography-h2",
+                                        "h3": "MuiTypography-h3",
+                                        "h4": "MuiTypography-h4",
+                                        "h5": "MuiTypography-h5",
+                                        "h6": "MuiTypography-h6",
+                                        "noWrap": "MuiTypography-noWrap",
+                                        "overline": "MuiTypography-overline",
+                                        "paragraph": "MuiTypography-paragraph",
+                                        "root": "MuiTypography-root",
+                                        "srOnly": "MuiTypography-srOnly",
+                                        "subtitle1": "MuiTypography-subtitle1",
+                                        "subtitle2": "MuiTypography-subtitle2",
+                                      }
+                                    }
+                                    color="inherit"
+                                    onClick={[Function]}
+                                    theme={
+                                      Object {
+                                        "breakpoints": Object {
+                                          "between": [Function],
+                                          "down": [Function],
+                                          "keys": Array [
+                                            "xs",
+                                            "sm",
+                                            "md",
+                                            "lg",
+                                            "xl",
+                                          ],
+                                          "only": [Function],
+                                          "up": [Function],
+                                          "values": Object {
+                                            "lg": 1280,
+                                            "md": 960,
+                                            "sm": 600,
+                                            "xl": 1920,
+                                            "xs": 0,
+                                          },
+                                          "width": [Function],
+                                        },
+                                        "direction": "ltr",
+                                        "mixins": Object {
+                                          "gutters": [Function],
+                                          "toolbar": Object {
+                                            "@media (min-width:0px) and (orientation: landscape)": Object {
+                                              "minHeight": 48,
+                                            },
+                                            "@media (min-width:600px)": Object {
+                                              "minHeight": 64,
+                                            },
+                                            "minHeight": 56,
+                                          },
+                                        },
+                                        "overrides": Object {},
+                                        "palette": Object {
+                                          "action": Object {
+                                            "active": "rgba(0, 0, 0, 0.54)",
+                                            "disabled": "rgba(0, 0, 0, 0.26)",
+                                            "disabledBackground": "rgba(0, 0, 0, 0.12)",
+                                            "hover": "rgba(0, 0, 0, 0.08)",
+                                            "hoverOpacity": 0.08,
+                                            "selected": "rgba(0, 0, 0, 0.14)",
+                                          },
+                                          "augmentColor": [Function],
+                                          "background": Object {
+                                            "default": "#fafafa",
+                                            "paper": "#fff",
+                                          },
+                                          "common": Object {
+                                            "black": "#000",
+                                            "white": "#fff",
+                                          },
+                                          "contrastThreshold": 3,
+                                          "divider": "rgba(0, 0, 0, 0.12)",
+                                          "error": Object {
+                                            "contrastText": "#fff",
+                                            "dark": "#d32f2f",
+                                            "light": "#e57373",
+                                            "main": "#f44336",
+                                          },
+                                          "getContrastText": [Function],
+                                          "grey": Object {
+                                            "100": "#f5f5f5",
+                                            "200": "#eeeeee",
+                                            "300": "#e0e0e0",
+                                            "400": "#bdbdbd",
+                                            "50": "#fafafa",
+                                            "500": "#9e9e9e",
+                                            "600": "#757575",
+                                            "700": "#616161",
+                                            "800": "#424242",
+                                            "900": "#212121",
+                                            "A100": "#d5d5d5",
+                                            "A200": "#aaaaaa",
+                                            "A400": "#303030",
+                                            "A700": "#616161",
+                                          },
+                                          "primary": Object {
+                                            "contrastText": "#fff",
+                                            "dark": "#303f9f",
+                                            "light": "#7986cb",
+                                            "main": "#3f51b5",
+                                          },
+                                          "secondary": Object {
+                                            "contrastText": "#fff",
+                                            "dark": "#c51162",
+                                            "light": "#ff4081",
+                                            "main": "#f50057",
+                                          },
+                                          "text": Object {
+                                            "disabled": "rgba(0, 0, 0, 0.38)",
+                                            "hint": "rgba(0, 0, 0, 0.38)",
+                                            "primary": "rgba(0, 0, 0, 0.87)",
+                                            "secondary": "rgba(0, 0, 0, 0.54)",
+                                          },
+                                          "tonalOffset": 0.2,
+                                          "type": "light",
+                                        },
+                                        "props": Object {},
+                                        "shadows": Array [
+                                          "none",
+                                          "0px 1px 3px 0px rgba(0,0,0,0.2),0px 1px 1px 0px rgba(0,0,0,0.14),0px 2px 1px -1px rgba(0,0,0,0.12)",
+                                          "0px 1px 5px 0px rgba(0,0,0,0.2),0px 2px 2px 0px rgba(0,0,0,0.14),0px 3px 1px -2px rgba(0,0,0,0.12)",
+                                          "0px 1px 8px 0px rgba(0,0,0,0.2),0px 3px 4px 0px rgba(0,0,0,0.14),0px 3px 3px -2px rgba(0,0,0,0.12)",
+                                          "0px 2px 4px -1px rgba(0,0,0,0.2),0px 4px 5px 0px rgba(0,0,0,0.14),0px 1px 10px 0px rgba(0,0,0,0.12)",
+                                          "0px 3px 5px -1px rgba(0,0,0,0.2),0px 5px 8px 0px rgba(0,0,0,0.14),0px 1px 14px 0px rgba(0,0,0,0.12)",
+                                          "0px 3px 5px -1px rgba(0,0,0,0.2),0px 6px 10px 0px rgba(0,0,0,0.14),0px 1px 18px 0px rgba(0,0,0,0.12)",
+                                          "0px 4px 5px -2px rgba(0,0,0,0.2),0px 7px 10px 1px rgba(0,0,0,0.14),0px 2px 16px 1px rgba(0,0,0,0.12)",
+                                          "0px 5px 5px -3px rgba(0,0,0,0.2),0px 8px 10px 1px rgba(0,0,0,0.14),0px 3px 14px 2px rgba(0,0,0,0.12)",
+                                          "0px 5px 6px -3px rgba(0,0,0,0.2),0px 9px 12px 1px rgba(0,0,0,0.14),0px 3px 16px 2px rgba(0,0,0,0.12)",
+                                          "0px 6px 6px -3px rgba(0,0,0,0.2),0px 10px 14px 1px rgba(0,0,0,0.14),0px 4px 18px 3px rgba(0,0,0,0.12)",
+                                          "0px 6px 7px -4px rgba(0,0,0,0.2),0px 11px 15px 1px rgba(0,0,0,0.14),0px 4px 20px 3px rgba(0,0,0,0.12)",
+                                          "0px 7px 8px -4px rgba(0,0,0,0.2),0px 12px 17px 2px rgba(0,0,0,0.14),0px 5px 22px 4px rgba(0,0,0,0.12)",
+                                          "0px 7px 8px -4px rgba(0,0,0,0.2),0px 13px 19px 2px rgba(0,0,0,0.14),0px 5px 24px 4px rgba(0,0,0,0.12)",
+                                          "0px 7px 9px -4px rgba(0,0,0,0.2),0px 14px 21px 2px rgba(0,0,0,0.14),0px 5px 26px 4px rgba(0,0,0,0.12)",
+                                          "0px 8px 9px -5px rgba(0,0,0,0.2),0px 15px 22px 2px rgba(0,0,0,0.14),0px 6px 28px 5px rgba(0,0,0,0.12)",
+                                          "0px 8px 10px -5px rgba(0,0,0,0.2),0px 16px 24px 2px rgba(0,0,0,0.14),0px 6px 30px 5px rgba(0,0,0,0.12)",
+                                          "0px 8px 11px -5px rgba(0,0,0,0.2),0px 17px 26px 2px rgba(0,0,0,0.14),0px 6px 32px 5px rgba(0,0,0,0.12)",
+                                          "0px 9px 11px -5px rgba(0,0,0,0.2),0px 18px 28px 2px rgba(0,0,0,0.14),0px 7px 34px 6px rgba(0,0,0,0.12)",
+                                          "0px 9px 12px -6px rgba(0,0,0,0.2),0px 19px 29px 2px rgba(0,0,0,0.14),0px 7px 36px 6px rgba(0,0,0,0.12)",
+                                          "0px 10px 13px -6px rgba(0,0,0,0.2),0px 20px 31px 3px rgba(0,0,0,0.14),0px 8px 38px 7px rgba(0,0,0,0.12)",
+                                          "0px 10px 13px -6px rgba(0,0,0,0.2),0px 21px 33px 3px rgba(0,0,0,0.14),0px 8px 40px 7px rgba(0,0,0,0.12)",
+                                          "0px 10px 14px -6px rgba(0,0,0,0.2),0px 22px 35px 3px rgba(0,0,0,0.14),0px 8px 42px 7px rgba(0,0,0,0.12)",
+                                          "0px 11px 14px -7px rgba(0,0,0,0.2),0px 23px 36px 3px rgba(0,0,0,0.14),0px 9px 44px 8px rgba(0,0,0,0.12)",
+                                          "0px 11px 15px -7px rgba(0,0,0,0.2),0px 24px 38px 3px rgba(0,0,0,0.14),0px 9px 46px 8px rgba(0,0,0,0.12)",
+                                        ],
+                                        "shape": Object {
+                                          "borderRadius": 4,
+                                        },
+                                        "spacing": [Function],
+                                        "transitions": Object {
+                                          "create": [Function],
+                                          "duration": Object {
+                                            "complex": 375,
+                                            "enteringScreen": 225,
+                                            "leavingScreen": 195,
+                                            "short": 250,
+                                            "shorter": 200,
+                                            "shortest": 150,
+                                            "standard": 300,
+                                          },
+                                          "easing": Object {
+                                            "easeIn": "cubic-bezier(0.4, 0, 1, 1)",
+                                            "easeInOut": "cubic-bezier(0.4, 0, 0.2, 1)",
+                                            "easeOut": "cubic-bezier(0.0, 0, 0.2, 1)",
+                                            "sharp": "cubic-bezier(0.4, 0, 0.6, 1)",
+                                          },
+                                          "getAutoHeightDuration": [Function],
+                                        },
+                                        "typography": Object {
+                                          "body1": Object {
+                                            "fontFamily": "\\"Roboto\\", \\"Helvetica\\", \\"Arial\\", sans-serif",
+                                            "fontSize": "1rem",
+                                            "fontWeight": 400,
+                                            "letterSpacing": "0.00938em",
+                                            "lineHeight": 1.5,
+                                          },
+                                          "body2": Object {
+                                            "fontFamily": "\\"Roboto\\", \\"Helvetica\\", \\"Arial\\", sans-serif",
+                                            "fontSize": "0.875rem",
+                                            "fontWeight": 400,
+                                            "letterSpacing": "0.01071em",
+                                            "lineHeight": 1.43,
+                                          },
+                                          "button": Object {
+                                            "fontFamily": "\\"Roboto\\", \\"Helvetica\\", \\"Arial\\", sans-serif",
+                                            "fontSize": "0.875rem",
+                                            "fontWeight": 500,
+                                            "letterSpacing": "0.02857em",
+                                            "lineHeight": 1.75,
+                                            "textTransform": "uppercase",
+                                          },
+                                          "caption": Object {
+                                            "fontFamily": "\\"Roboto\\", \\"Helvetica\\", \\"Arial\\", sans-serif",
+                                            "fontSize": "0.75rem",
+                                            "fontWeight": 400,
+                                            "letterSpacing": "0.03333em",
+                                            "lineHeight": 1.66,
+                                          },
+                                          "fontFamily": "\\"Roboto\\", \\"Helvetica\\", \\"Arial\\", sans-serif",
+                                          "fontSize": 14,
+                                          "fontWeightBold": 700,
+                                          "fontWeightLight": 300,
+                                          "fontWeightMedium": 500,
+                                          "fontWeightRegular": 400,
+                                          "h1": Object {
+                                            "fontFamily": "\\"Roboto\\", \\"Helvetica\\", \\"Arial\\", sans-serif",
+                                            "fontSize": "6rem",
+                                            "fontWeight": 300,
+                                            "letterSpacing": "-0.01562em",
+                                            "lineHeight": 1,
+                                          },
+                                          "h2": Object {
+                                            "fontFamily": "\\"Roboto\\", \\"Helvetica\\", \\"Arial\\", sans-serif",
+                                            "fontSize": "3.75rem",
+                                            "fontWeight": 300,
+                                            "letterSpacing": "-0.00833em",
+                                            "lineHeight": 1,
+                                          },
+                                          "h3": Object {
+                                            "fontFamily": "\\"Roboto\\", \\"Helvetica\\", \\"Arial\\", sans-serif",
+                                            "fontSize": "3rem",
+                                            "fontWeight": 400,
+                                            "letterSpacing": "0em",
+                                            "lineHeight": 1.04,
+                                          },
+                                          "h4": Object {
+                                            "fontFamily": "\\"Roboto\\", \\"Helvetica\\", \\"Arial\\", sans-serif",
+                                            "fontSize": "2.125rem",
+                                            "fontWeight": 400,
+                                            "letterSpacing": "0.00735em",
+                                            "lineHeight": 1.17,
+                                          },
+                                          "h5": Object {
+                                            "fontFamily": "\\"Roboto\\", \\"Helvetica\\", \\"Arial\\", sans-serif",
+                                            "fontSize": "1.5rem",
+                                            "fontWeight": 400,
+                                            "letterSpacing": "0em",
+                                            "lineHeight": 1.33,
+                                          },
+                                          "h6": Object {
+                                            "fontFamily": "\\"Roboto\\", \\"Helvetica\\", \\"Arial\\", sans-serif",
+                                            "fontSize": "1.25rem",
+                                            "fontWeight": 500,
+                                            "letterSpacing": "0.0075em",
+                                            "lineHeight": 1.6,
+                                          },
+                                          "htmlFontSize": 16,
+                                          "overline": Object {
+                                            "fontFamily": "\\"Roboto\\", \\"Helvetica\\", \\"Arial\\", sans-serif",
+                                            "fontSize": "0.75rem",
+                                            "fontWeight": 400,
+                                            "letterSpacing": "0.08333em",
+                                            "lineHeight": 2.66,
+                                            "textTransform": "uppercase",
+                                          },
+                                          "pxToRem": [Function],
+                                          "round": [Function],
+                                          "subtitle1": Object {
+                                            "fontFamily": "\\"Roboto\\", \\"Helvetica\\", \\"Arial\\", sans-serif",
+                                            "fontSize": "1rem",
+                                            "fontWeight": 400,
+                                            "letterSpacing": "0.00938em",
+                                            "lineHeight": 1.75,
+                                          },
+                                          "subtitle2": Object {
+                                            "fontFamily": "\\"Roboto\\", \\"Helvetica\\", \\"Arial\\", sans-serif",
+                                            "fontSize": "0.875rem",
+                                            "fontWeight": 500,
+                                            "letterSpacing": "0.00714em",
+                                            "lineHeight": 1.57,
+                                          },
+                                        },
+                                        "zIndex": Object {
+                                          "appBar": 1100,
+                                          "drawer": 1200,
+                                          "mobileStepper": 1000,
+                                          "modal": 1300,
+                                          "snackbar": 1400,
+                                          "tooltip": 1500,
+                                        },
+                                      }
+                                    }
+                                    variant="h6"
+                                  >
+                                    <h6
+                                      className="MuiTypography-root Header-flex-11 Header-title-12 MuiTypography-h6 MuiTypography-colorInherit"
+                                      onClick={[Function]}
+                                    >
+                                      Foo
+                                    </h6>
+                                  </ForwardRef(Typography)>
+                                </WithStyles(ForwardRef(Typography))>
+                              </div>
+                            </ForwardRef(Toolbar)>
+                          </WithStyles(ForwardRef(Toolbar))>
+                        </header>
+                      </ForwardRef(Paper)>
+                    </WithStyles(ForwardRef(Paper))>
+                  </ForwardRef(AppBar)>
+                </WithStyles(ForwardRef(AppBar))>
+              </div>
+            </Header>
+          </WithStyles(Header)>
+          <div
+            className="BaseBranch-appFrame-1 BaseBranch-appFrameWithCookieInfo-2"
+          >
+            <WithStyles(Drawer)
+              data={
+                Array [
+                  Object {
+                    "icon": null,
+                    "title": "Dashboard",
+                    "type": "link",
+                    "url": "/",
+                  },
+                  Object {
+                    "isDisabled": true,
+                    "title": "New portfolio",
+                    "type": "link",
+                    "url": "/portfolio",
+                  },
+                  Object {
+                    "type": "divider",
+                  },
+                  Object {
+                    "icon": Object {
+                      "$$typeof": Symbol(react.memo),
+                      "compare": null,
+                      "displayName": "BugReportIcon",
+                      "muiName": "SvgIcon",
+                      "type": Object {
+                        "$$typeof": Symbol(react.forward_ref),
+                        "render": [Function],
+                      },
+                    },
+                    "title": "Report a bug",
+                    "type": "link",
+                    "url": "/bug",
+                  },
+                ]
+              }
+              isOpen={false}
+              onClose={[Function]}
+              redirectTo={[Function]}
+            >
+              <Drawer
+                classes={
+                  Object {
+                    "drawerHeader": "Drawer-drawerHeader-105",
+                    "drawerPaper": "Drawer-drawerPaper-104",
+                  }
+                }
+                data={
+                  Array [
+                    Object {
+                      "icon": null,
+                      "title": "Dashboard",
+                      "type": "link",
+                      "url": "/",
+                    },
+                    Object {
+                      "isDisabled": true,
+                      "title": "New portfolio",
+                      "type": "link",
+                      "url": "/portfolio",
+                    },
+                    Object {
+                      "type": "divider",
+                    },
+                    Object {
+                      "icon": Object {
+                        "$$typeof": Symbol(react.memo),
+                        "compare": null,
+                        "displayName": "BugReportIcon",
+                        "muiName": "SvgIcon",
+                        "type": Object {
+                          "$$typeof": Symbol(react.forward_ref),
+                          "render": [Function],
+                        },
+                      },
+                      "title": "Report a bug",
+                      "type": "link",
+                      "url": "/bug",
+                    },
+                  ]
+                }
+                isOpen={false}
+                onClose={[Function]}
+                redirectTo={[Function]}
+              >
+                <WithStyles(ForwardRef(Drawer))
+                  anchor="left"
+                  classes={
+                    Object {
+                      "paper": "Drawer-drawerPaper-104",
+                    }
+                  }
+                  open={false}
+                  variant="persistent"
                 >
-                  <span
-                    className="MuiTypography-root-75 MuiTypography-subheading-82 MuiListItemText-primary-137"
+                  <ForwardRef(Drawer)
+                    anchor="left"
+                    classes={
+                      Object {
+                        "docked": "MuiDrawer-docked",
+                        "modal": "MuiDrawer-modal",
+                        "paper": "MuiDrawer-paper Drawer-drawerPaper-104",
+                        "paperAnchorBottom": "MuiDrawer-paperAnchorBottom",
+                        "paperAnchorDockedBottom": "MuiDrawer-paperAnchorDockedBottom",
+                        "paperAnchorDockedLeft": "MuiDrawer-paperAnchorDockedLeft",
+                        "paperAnchorDockedRight": "MuiDrawer-paperAnchorDockedRight",
+                        "paperAnchorDockedTop": "MuiDrawer-paperAnchorDockedTop",
+                        "paperAnchorLeft": "MuiDrawer-paperAnchorLeft",
+                        "paperAnchorRight": "MuiDrawer-paperAnchorRight",
+                        "paperAnchorTop": "MuiDrawer-paperAnchorTop",
+                        "root": "MuiDrawer-root",
+                      }
+                    }
+                    open={false}
+                    theme={
+                      Object {
+                        "breakpoints": Object {
+                          "between": [Function],
+                          "down": [Function],
+                          "keys": Array [
+                            "xs",
+                            "sm",
+                            "md",
+                            "lg",
+                            "xl",
+                          ],
+                          "only": [Function],
+                          "up": [Function],
+                          "values": Object {
+                            "lg": 1280,
+                            "md": 960,
+                            "sm": 600,
+                            "xl": 1920,
+                            "xs": 0,
+                          },
+                          "width": [Function],
+                        },
+                        "direction": "ltr",
+                        "mixins": Object {
+                          "gutters": [Function],
+                          "toolbar": Object {
+                            "@media (min-width:0px) and (orientation: landscape)": Object {
+                              "minHeight": 48,
+                            },
+                            "@media (min-width:600px)": Object {
+                              "minHeight": 64,
+                            },
+                            "minHeight": 56,
+                          },
+                        },
+                        "overrides": Object {},
+                        "palette": Object {
+                          "action": Object {
+                            "active": "rgba(0, 0, 0, 0.54)",
+                            "disabled": "rgba(0, 0, 0, 0.26)",
+                            "disabledBackground": "rgba(0, 0, 0, 0.12)",
+                            "hover": "rgba(0, 0, 0, 0.08)",
+                            "hoverOpacity": 0.08,
+                            "selected": "rgba(0, 0, 0, 0.14)",
+                          },
+                          "augmentColor": [Function],
+                          "background": Object {
+                            "default": "#fafafa",
+                            "paper": "#fff",
+                          },
+                          "common": Object {
+                            "black": "#000",
+                            "white": "#fff",
+                          },
+                          "contrastThreshold": 3,
+                          "divider": "rgba(0, 0, 0, 0.12)",
+                          "error": Object {
+                            "contrastText": "#fff",
+                            "dark": "#d32f2f",
+                            "light": "#e57373",
+                            "main": "#f44336",
+                          },
+                          "getContrastText": [Function],
+                          "grey": Object {
+                            "100": "#f5f5f5",
+                            "200": "#eeeeee",
+                            "300": "#e0e0e0",
+                            "400": "#bdbdbd",
+                            "50": "#fafafa",
+                            "500": "#9e9e9e",
+                            "600": "#757575",
+                            "700": "#616161",
+                            "800": "#424242",
+                            "900": "#212121",
+                            "A100": "#d5d5d5",
+                            "A200": "#aaaaaa",
+                            "A400": "#303030",
+                            "A700": "#616161",
+                          },
+                          "primary": Object {
+                            "contrastText": "#fff",
+                            "dark": "#303f9f",
+                            "light": "#7986cb",
+                            "main": "#3f51b5",
+                          },
+                          "secondary": Object {
+                            "contrastText": "#fff",
+                            "dark": "#c51162",
+                            "light": "#ff4081",
+                            "main": "#f50057",
+                          },
+                          "text": Object {
+                            "disabled": "rgba(0, 0, 0, 0.38)",
+                            "hint": "rgba(0, 0, 0, 0.38)",
+                            "primary": "rgba(0, 0, 0, 0.87)",
+                            "secondary": "rgba(0, 0, 0, 0.54)",
+                          },
+                          "tonalOffset": 0.2,
+                          "type": "light",
+                        },
+                        "props": Object {},
+                        "shadows": Array [
+                          "none",
+                          "0px 1px 3px 0px rgba(0,0,0,0.2),0px 1px 1px 0px rgba(0,0,0,0.14),0px 2px 1px -1px rgba(0,0,0,0.12)",
+                          "0px 1px 5px 0px rgba(0,0,0,0.2),0px 2px 2px 0px rgba(0,0,0,0.14),0px 3px 1px -2px rgba(0,0,0,0.12)",
+                          "0px 1px 8px 0px rgba(0,0,0,0.2),0px 3px 4px 0px rgba(0,0,0,0.14),0px 3px 3px -2px rgba(0,0,0,0.12)",
+                          "0px 2px 4px -1px rgba(0,0,0,0.2),0px 4px 5px 0px rgba(0,0,0,0.14),0px 1px 10px 0px rgba(0,0,0,0.12)",
+                          "0px 3px 5px -1px rgba(0,0,0,0.2),0px 5px 8px 0px rgba(0,0,0,0.14),0px 1px 14px 0px rgba(0,0,0,0.12)",
+                          "0px 3px 5px -1px rgba(0,0,0,0.2),0px 6px 10px 0px rgba(0,0,0,0.14),0px 1px 18px 0px rgba(0,0,0,0.12)",
+                          "0px 4px 5px -2px rgba(0,0,0,0.2),0px 7px 10px 1px rgba(0,0,0,0.14),0px 2px 16px 1px rgba(0,0,0,0.12)",
+                          "0px 5px 5px -3px rgba(0,0,0,0.2),0px 8px 10px 1px rgba(0,0,0,0.14),0px 3px 14px 2px rgba(0,0,0,0.12)",
+                          "0px 5px 6px -3px rgba(0,0,0,0.2),0px 9px 12px 1px rgba(0,0,0,0.14),0px 3px 16px 2px rgba(0,0,0,0.12)",
+                          "0px 6px 6px -3px rgba(0,0,0,0.2),0px 10px 14px 1px rgba(0,0,0,0.14),0px 4px 18px 3px rgba(0,0,0,0.12)",
+                          "0px 6px 7px -4px rgba(0,0,0,0.2),0px 11px 15px 1px rgba(0,0,0,0.14),0px 4px 20px 3px rgba(0,0,0,0.12)",
+                          "0px 7px 8px -4px rgba(0,0,0,0.2),0px 12px 17px 2px rgba(0,0,0,0.14),0px 5px 22px 4px rgba(0,0,0,0.12)",
+                          "0px 7px 8px -4px rgba(0,0,0,0.2),0px 13px 19px 2px rgba(0,0,0,0.14),0px 5px 24px 4px rgba(0,0,0,0.12)",
+                          "0px 7px 9px -4px rgba(0,0,0,0.2),0px 14px 21px 2px rgba(0,0,0,0.14),0px 5px 26px 4px rgba(0,0,0,0.12)",
+                          "0px 8px 9px -5px rgba(0,0,0,0.2),0px 15px 22px 2px rgba(0,0,0,0.14),0px 6px 28px 5px rgba(0,0,0,0.12)",
+                          "0px 8px 10px -5px rgba(0,0,0,0.2),0px 16px 24px 2px rgba(0,0,0,0.14),0px 6px 30px 5px rgba(0,0,0,0.12)",
+                          "0px 8px 11px -5px rgba(0,0,0,0.2),0px 17px 26px 2px rgba(0,0,0,0.14),0px 6px 32px 5px rgba(0,0,0,0.12)",
+                          "0px 9px 11px -5px rgba(0,0,0,0.2),0px 18px 28px 2px rgba(0,0,0,0.14),0px 7px 34px 6px rgba(0,0,0,0.12)",
+                          "0px 9px 12px -6px rgba(0,0,0,0.2),0px 19px 29px 2px rgba(0,0,0,0.14),0px 7px 36px 6px rgba(0,0,0,0.12)",
+                          "0px 10px 13px -6px rgba(0,0,0,0.2),0px 20px 31px 3px rgba(0,0,0,0.14),0px 8px 38px 7px rgba(0,0,0,0.12)",
+                          "0px 10px 13px -6px rgba(0,0,0,0.2),0px 21px 33px 3px rgba(0,0,0,0.14),0px 8px 40px 7px rgba(0,0,0,0.12)",
+                          "0px 10px 14px -6px rgba(0,0,0,0.2),0px 22px 35px 3px rgba(0,0,0,0.14),0px 8px 42px 7px rgba(0,0,0,0.12)",
+                          "0px 11px 14px -7px rgba(0,0,0,0.2),0px 23px 36px 3px rgba(0,0,0,0.14),0px 9px 44px 8px rgba(0,0,0,0.12)",
+                          "0px 11px 15px -7px rgba(0,0,0,0.2),0px 24px 38px 3px rgba(0,0,0,0.14),0px 9px 46px 8px rgba(0,0,0,0.12)",
+                        ],
+                        "shape": Object {
+                          "borderRadius": 4,
+                        },
+                        "spacing": [Function],
+                        "transitions": Object {
+                          "create": [Function],
+                          "duration": Object {
+                            "complex": 375,
+                            "enteringScreen": 225,
+                            "leavingScreen": 195,
+                            "short": 250,
+                            "shorter": 200,
+                            "shortest": 150,
+                            "standard": 300,
+                          },
+                          "easing": Object {
+                            "easeIn": "cubic-bezier(0.4, 0, 1, 1)",
+                            "easeInOut": "cubic-bezier(0.4, 0, 0.2, 1)",
+                            "easeOut": "cubic-bezier(0.0, 0, 0.2, 1)",
+                            "sharp": "cubic-bezier(0.4, 0, 0.6, 1)",
+                          },
+                          "getAutoHeightDuration": [Function],
+                        },
+                        "typography": Object {
+                          "body1": Object {
+                            "fontFamily": "\\"Roboto\\", \\"Helvetica\\", \\"Arial\\", sans-serif",
+                            "fontSize": "1rem",
+                            "fontWeight": 400,
+                            "letterSpacing": "0.00938em",
+                            "lineHeight": 1.5,
+                          },
+                          "body2": Object {
+                            "fontFamily": "\\"Roboto\\", \\"Helvetica\\", \\"Arial\\", sans-serif",
+                            "fontSize": "0.875rem",
+                            "fontWeight": 400,
+                            "letterSpacing": "0.01071em",
+                            "lineHeight": 1.43,
+                          },
+                          "button": Object {
+                            "fontFamily": "\\"Roboto\\", \\"Helvetica\\", \\"Arial\\", sans-serif",
+                            "fontSize": "0.875rem",
+                            "fontWeight": 500,
+                            "letterSpacing": "0.02857em",
+                            "lineHeight": 1.75,
+                            "textTransform": "uppercase",
+                          },
+                          "caption": Object {
+                            "fontFamily": "\\"Roboto\\", \\"Helvetica\\", \\"Arial\\", sans-serif",
+                            "fontSize": "0.75rem",
+                            "fontWeight": 400,
+                            "letterSpacing": "0.03333em",
+                            "lineHeight": 1.66,
+                          },
+                          "fontFamily": "\\"Roboto\\", \\"Helvetica\\", \\"Arial\\", sans-serif",
+                          "fontSize": 14,
+                          "fontWeightBold": 700,
+                          "fontWeightLight": 300,
+                          "fontWeightMedium": 500,
+                          "fontWeightRegular": 400,
+                          "h1": Object {
+                            "fontFamily": "\\"Roboto\\", \\"Helvetica\\", \\"Arial\\", sans-serif",
+                            "fontSize": "6rem",
+                            "fontWeight": 300,
+                            "letterSpacing": "-0.01562em",
+                            "lineHeight": 1,
+                          },
+                          "h2": Object {
+                            "fontFamily": "\\"Roboto\\", \\"Helvetica\\", \\"Arial\\", sans-serif",
+                            "fontSize": "3.75rem",
+                            "fontWeight": 300,
+                            "letterSpacing": "-0.00833em",
+                            "lineHeight": 1,
+                          },
+                          "h3": Object {
+                            "fontFamily": "\\"Roboto\\", \\"Helvetica\\", \\"Arial\\", sans-serif",
+                            "fontSize": "3rem",
+                            "fontWeight": 400,
+                            "letterSpacing": "0em",
+                            "lineHeight": 1.04,
+                          },
+                          "h4": Object {
+                            "fontFamily": "\\"Roboto\\", \\"Helvetica\\", \\"Arial\\", sans-serif",
+                            "fontSize": "2.125rem",
+                            "fontWeight": 400,
+                            "letterSpacing": "0.00735em",
+                            "lineHeight": 1.17,
+                          },
+                          "h5": Object {
+                            "fontFamily": "\\"Roboto\\", \\"Helvetica\\", \\"Arial\\", sans-serif",
+                            "fontSize": "1.5rem",
+                            "fontWeight": 400,
+                            "letterSpacing": "0em",
+                            "lineHeight": 1.33,
+                          },
+                          "h6": Object {
+                            "fontFamily": "\\"Roboto\\", \\"Helvetica\\", \\"Arial\\", sans-serif",
+                            "fontSize": "1.25rem",
+                            "fontWeight": 500,
+                            "letterSpacing": "0.0075em",
+                            "lineHeight": 1.6,
+                          },
+                          "htmlFontSize": 16,
+                          "overline": Object {
+                            "fontFamily": "\\"Roboto\\", \\"Helvetica\\", \\"Arial\\", sans-serif",
+                            "fontSize": "0.75rem",
+                            "fontWeight": 400,
+                            "letterSpacing": "0.08333em",
+                            "lineHeight": 2.66,
+                            "textTransform": "uppercase",
+                          },
+                          "pxToRem": [Function],
+                          "round": [Function],
+                          "subtitle1": Object {
+                            "fontFamily": "\\"Roboto\\", \\"Helvetica\\", \\"Arial\\", sans-serif",
+                            "fontSize": "1rem",
+                            "fontWeight": 400,
+                            "letterSpacing": "0.00938em",
+                            "lineHeight": 1.75,
+                          },
+                          "subtitle2": Object {
+                            "fontFamily": "\\"Roboto\\", \\"Helvetica\\", \\"Arial\\", sans-serif",
+                            "fontSize": "0.875rem",
+                            "fontWeight": 500,
+                            "letterSpacing": "0.00714em",
+                            "lineHeight": 1.57,
+                          },
+                        },
+                        "zIndex": Object {
+                          "appBar": 1100,
+                          "drawer": 1200,
+                          "mobileStepper": 1000,
+                          "modal": 1300,
+                          "snackbar": 1400,
+                          "tooltip": 1500,
+                        },
+                      }
+                    }
+                    variant="persistent"
                   >
-                    Report a bug
-                  </span>
-                </div>
-                <span
-                  className="MuiTouchRipple-root-68"
-                />
+                    <div
+                      className="MuiDrawer-root MuiDrawer-docked"
+                    >
+                      <WithTheme(ForwardRef(Slide))
+                        appear={true}
+                        direction="right"
+                        in={false}
+                        timeout={
+                          Object {
+                            "enter": 225,
+                            "exit": 195,
+                          }
+                        }
+                      >
+                        <ForwardRef(Slide)
+                          appear={true}
+                          direction="right"
+                          in={false}
+                          theme={
+                            Object {
+                              "breakpoints": Object {
+                                "between": [Function],
+                                "down": [Function],
+                                "keys": Array [
+                                  "xs",
+                                  "sm",
+                                  "md",
+                                  "lg",
+                                  "xl",
+                                ],
+                                "only": [Function],
+                                "up": [Function],
+                                "values": Object {
+                                  "lg": 1280,
+                                  "md": 960,
+                                  "sm": 600,
+                                  "xl": 1920,
+                                  "xs": 0,
+                                },
+                                "width": [Function],
+                              },
+                              "direction": "ltr",
+                              "mixins": Object {
+                                "gutters": [Function],
+                                "toolbar": Object {
+                                  "@media (min-width:0px) and (orientation: landscape)": Object {
+                                    "minHeight": 48,
+                                  },
+                                  "@media (min-width:600px)": Object {
+                                    "minHeight": 64,
+                                  },
+                                  "minHeight": 56,
+                                },
+                              },
+                              "overrides": Object {},
+                              "palette": Object {
+                                "action": Object {
+                                  "active": "rgba(0, 0, 0, 0.54)",
+                                  "disabled": "rgba(0, 0, 0, 0.26)",
+                                  "disabledBackground": "rgba(0, 0, 0, 0.12)",
+                                  "hover": "rgba(0, 0, 0, 0.08)",
+                                  "hoverOpacity": 0.08,
+                                  "selected": "rgba(0, 0, 0, 0.14)",
+                                },
+                                "augmentColor": [Function],
+                                "background": Object {
+                                  "default": "#fafafa",
+                                  "paper": "#fff",
+                                },
+                                "common": Object {
+                                  "black": "#000",
+                                  "white": "#fff",
+                                },
+                                "contrastThreshold": 3,
+                                "divider": "rgba(0, 0, 0, 0.12)",
+                                "error": Object {
+                                  "contrastText": "#fff",
+                                  "dark": "#d32f2f",
+                                  "light": "#e57373",
+                                  "main": "#f44336",
+                                },
+                                "getContrastText": [Function],
+                                "grey": Object {
+                                  "100": "#f5f5f5",
+                                  "200": "#eeeeee",
+                                  "300": "#e0e0e0",
+                                  "400": "#bdbdbd",
+                                  "50": "#fafafa",
+                                  "500": "#9e9e9e",
+                                  "600": "#757575",
+                                  "700": "#616161",
+                                  "800": "#424242",
+                                  "900": "#212121",
+                                  "A100": "#d5d5d5",
+                                  "A200": "#aaaaaa",
+                                  "A400": "#303030",
+                                  "A700": "#616161",
+                                },
+                                "primary": Object {
+                                  "contrastText": "#fff",
+                                  "dark": "#303f9f",
+                                  "light": "#7986cb",
+                                  "main": "#3f51b5",
+                                },
+                                "secondary": Object {
+                                  "contrastText": "#fff",
+                                  "dark": "#c51162",
+                                  "light": "#ff4081",
+                                  "main": "#f50057",
+                                },
+                                "text": Object {
+                                  "disabled": "rgba(0, 0, 0, 0.38)",
+                                  "hint": "rgba(0, 0, 0, 0.38)",
+                                  "primary": "rgba(0, 0, 0, 0.87)",
+                                  "secondary": "rgba(0, 0, 0, 0.54)",
+                                },
+                                "tonalOffset": 0.2,
+                                "type": "light",
+                              },
+                              "props": Object {},
+                              "shadows": Array [
+                                "none",
+                                "0px 1px 3px 0px rgba(0,0,0,0.2),0px 1px 1px 0px rgba(0,0,0,0.14),0px 2px 1px -1px rgba(0,0,0,0.12)",
+                                "0px 1px 5px 0px rgba(0,0,0,0.2),0px 2px 2px 0px rgba(0,0,0,0.14),0px 3px 1px -2px rgba(0,0,0,0.12)",
+                                "0px 1px 8px 0px rgba(0,0,0,0.2),0px 3px 4px 0px rgba(0,0,0,0.14),0px 3px 3px -2px rgba(0,0,0,0.12)",
+                                "0px 2px 4px -1px rgba(0,0,0,0.2),0px 4px 5px 0px rgba(0,0,0,0.14),0px 1px 10px 0px rgba(0,0,0,0.12)",
+                                "0px 3px 5px -1px rgba(0,0,0,0.2),0px 5px 8px 0px rgba(0,0,0,0.14),0px 1px 14px 0px rgba(0,0,0,0.12)",
+                                "0px 3px 5px -1px rgba(0,0,0,0.2),0px 6px 10px 0px rgba(0,0,0,0.14),0px 1px 18px 0px rgba(0,0,0,0.12)",
+                                "0px 4px 5px -2px rgba(0,0,0,0.2),0px 7px 10px 1px rgba(0,0,0,0.14),0px 2px 16px 1px rgba(0,0,0,0.12)",
+                                "0px 5px 5px -3px rgba(0,0,0,0.2),0px 8px 10px 1px rgba(0,0,0,0.14),0px 3px 14px 2px rgba(0,0,0,0.12)",
+                                "0px 5px 6px -3px rgba(0,0,0,0.2),0px 9px 12px 1px rgba(0,0,0,0.14),0px 3px 16px 2px rgba(0,0,0,0.12)",
+                                "0px 6px 6px -3px rgba(0,0,0,0.2),0px 10px 14px 1px rgba(0,0,0,0.14),0px 4px 18px 3px rgba(0,0,0,0.12)",
+                                "0px 6px 7px -4px rgba(0,0,0,0.2),0px 11px 15px 1px rgba(0,0,0,0.14),0px 4px 20px 3px rgba(0,0,0,0.12)",
+                                "0px 7px 8px -4px rgba(0,0,0,0.2),0px 12px 17px 2px rgba(0,0,0,0.14),0px 5px 22px 4px rgba(0,0,0,0.12)",
+                                "0px 7px 8px -4px rgba(0,0,0,0.2),0px 13px 19px 2px rgba(0,0,0,0.14),0px 5px 24px 4px rgba(0,0,0,0.12)",
+                                "0px 7px 9px -4px rgba(0,0,0,0.2),0px 14px 21px 2px rgba(0,0,0,0.14),0px 5px 26px 4px rgba(0,0,0,0.12)",
+                                "0px 8px 9px -5px rgba(0,0,0,0.2),0px 15px 22px 2px rgba(0,0,0,0.14),0px 6px 28px 5px rgba(0,0,0,0.12)",
+                                "0px 8px 10px -5px rgba(0,0,0,0.2),0px 16px 24px 2px rgba(0,0,0,0.14),0px 6px 30px 5px rgba(0,0,0,0.12)",
+                                "0px 8px 11px -5px rgba(0,0,0,0.2),0px 17px 26px 2px rgba(0,0,0,0.14),0px 6px 32px 5px rgba(0,0,0,0.12)",
+                                "0px 9px 11px -5px rgba(0,0,0,0.2),0px 18px 28px 2px rgba(0,0,0,0.14),0px 7px 34px 6px rgba(0,0,0,0.12)",
+                                "0px 9px 12px -6px rgba(0,0,0,0.2),0px 19px 29px 2px rgba(0,0,0,0.14),0px 7px 36px 6px rgba(0,0,0,0.12)",
+                                "0px 10px 13px -6px rgba(0,0,0,0.2),0px 20px 31px 3px rgba(0,0,0,0.14),0px 8px 38px 7px rgba(0,0,0,0.12)",
+                                "0px 10px 13px -6px rgba(0,0,0,0.2),0px 21px 33px 3px rgba(0,0,0,0.14),0px 8px 40px 7px rgba(0,0,0,0.12)",
+                                "0px 10px 14px -6px rgba(0,0,0,0.2),0px 22px 35px 3px rgba(0,0,0,0.14),0px 8px 42px 7px rgba(0,0,0,0.12)",
+                                "0px 11px 14px -7px rgba(0,0,0,0.2),0px 23px 36px 3px rgba(0,0,0,0.14),0px 9px 44px 8px rgba(0,0,0,0.12)",
+                                "0px 11px 15px -7px rgba(0,0,0,0.2),0px 24px 38px 3px rgba(0,0,0,0.14),0px 9px 46px 8px rgba(0,0,0,0.12)",
+                              ],
+                              "shape": Object {
+                                "borderRadius": 4,
+                              },
+                              "spacing": [Function],
+                              "transitions": Object {
+                                "create": [Function],
+                                "duration": Object {
+                                  "complex": 375,
+                                  "enteringScreen": 225,
+                                  "leavingScreen": 195,
+                                  "short": 250,
+                                  "shorter": 200,
+                                  "shortest": 150,
+                                  "standard": 300,
+                                },
+                                "easing": Object {
+                                  "easeIn": "cubic-bezier(0.4, 0, 1, 1)",
+                                  "easeInOut": "cubic-bezier(0.4, 0, 0.2, 1)",
+                                  "easeOut": "cubic-bezier(0.0, 0, 0.2, 1)",
+                                  "sharp": "cubic-bezier(0.4, 0, 0.6, 1)",
+                                },
+                                "getAutoHeightDuration": [Function],
+                              },
+                              "typography": Object {
+                                "body1": Object {
+                                  "fontFamily": "\\"Roboto\\", \\"Helvetica\\", \\"Arial\\", sans-serif",
+                                  "fontSize": "1rem",
+                                  "fontWeight": 400,
+                                  "letterSpacing": "0.00938em",
+                                  "lineHeight": 1.5,
+                                },
+                                "body2": Object {
+                                  "fontFamily": "\\"Roboto\\", \\"Helvetica\\", \\"Arial\\", sans-serif",
+                                  "fontSize": "0.875rem",
+                                  "fontWeight": 400,
+                                  "letterSpacing": "0.01071em",
+                                  "lineHeight": 1.43,
+                                },
+                                "button": Object {
+                                  "fontFamily": "\\"Roboto\\", \\"Helvetica\\", \\"Arial\\", sans-serif",
+                                  "fontSize": "0.875rem",
+                                  "fontWeight": 500,
+                                  "letterSpacing": "0.02857em",
+                                  "lineHeight": 1.75,
+                                  "textTransform": "uppercase",
+                                },
+                                "caption": Object {
+                                  "fontFamily": "\\"Roboto\\", \\"Helvetica\\", \\"Arial\\", sans-serif",
+                                  "fontSize": "0.75rem",
+                                  "fontWeight": 400,
+                                  "letterSpacing": "0.03333em",
+                                  "lineHeight": 1.66,
+                                },
+                                "fontFamily": "\\"Roboto\\", \\"Helvetica\\", \\"Arial\\", sans-serif",
+                                "fontSize": 14,
+                                "fontWeightBold": 700,
+                                "fontWeightLight": 300,
+                                "fontWeightMedium": 500,
+                                "fontWeightRegular": 400,
+                                "h1": Object {
+                                  "fontFamily": "\\"Roboto\\", \\"Helvetica\\", \\"Arial\\", sans-serif",
+                                  "fontSize": "6rem",
+                                  "fontWeight": 300,
+                                  "letterSpacing": "-0.01562em",
+                                  "lineHeight": 1,
+                                },
+                                "h2": Object {
+                                  "fontFamily": "\\"Roboto\\", \\"Helvetica\\", \\"Arial\\", sans-serif",
+                                  "fontSize": "3.75rem",
+                                  "fontWeight": 300,
+                                  "letterSpacing": "-0.00833em",
+                                  "lineHeight": 1,
+                                },
+                                "h3": Object {
+                                  "fontFamily": "\\"Roboto\\", \\"Helvetica\\", \\"Arial\\", sans-serif",
+                                  "fontSize": "3rem",
+                                  "fontWeight": 400,
+                                  "letterSpacing": "0em",
+                                  "lineHeight": 1.04,
+                                },
+                                "h4": Object {
+                                  "fontFamily": "\\"Roboto\\", \\"Helvetica\\", \\"Arial\\", sans-serif",
+                                  "fontSize": "2.125rem",
+                                  "fontWeight": 400,
+                                  "letterSpacing": "0.00735em",
+                                  "lineHeight": 1.17,
+                                },
+                                "h5": Object {
+                                  "fontFamily": "\\"Roboto\\", \\"Helvetica\\", \\"Arial\\", sans-serif",
+                                  "fontSize": "1.5rem",
+                                  "fontWeight": 400,
+                                  "letterSpacing": "0em",
+                                  "lineHeight": 1.33,
+                                },
+                                "h6": Object {
+                                  "fontFamily": "\\"Roboto\\", \\"Helvetica\\", \\"Arial\\", sans-serif",
+                                  "fontSize": "1.25rem",
+                                  "fontWeight": 500,
+                                  "letterSpacing": "0.0075em",
+                                  "lineHeight": 1.6,
+                                },
+                                "htmlFontSize": 16,
+                                "overline": Object {
+                                  "fontFamily": "\\"Roboto\\", \\"Helvetica\\", \\"Arial\\", sans-serif",
+                                  "fontSize": "0.75rem",
+                                  "fontWeight": 400,
+                                  "letterSpacing": "0.08333em",
+                                  "lineHeight": 2.66,
+                                  "textTransform": "uppercase",
+                                },
+                                "pxToRem": [Function],
+                                "round": [Function],
+                                "subtitle1": Object {
+                                  "fontFamily": "\\"Roboto\\", \\"Helvetica\\", \\"Arial\\", sans-serif",
+                                  "fontSize": "1rem",
+                                  "fontWeight": 400,
+                                  "letterSpacing": "0.00938em",
+                                  "lineHeight": 1.75,
+                                },
+                                "subtitle2": Object {
+                                  "fontFamily": "\\"Roboto\\", \\"Helvetica\\", \\"Arial\\", sans-serif",
+                                  "fontSize": "0.875rem",
+                                  "fontWeight": 500,
+                                  "letterSpacing": "0.00714em",
+                                  "lineHeight": 1.57,
+                                },
+                              },
+                              "zIndex": Object {
+                                "appBar": 1100,
+                                "drawer": 1200,
+                                "mobileStepper": 1000,
+                                "modal": 1300,
+                                "snackbar": 1400,
+                                "tooltip": 1500,
+                              },
+                            }
+                          }
+                          timeout={
+                            Object {
+                              "enter": 225,
+                              "exit": 195,
+                            }
+                          }
+                        >
+                          <Transition
+                            appear={true}
+                            enter={true}
+                            exit={true}
+                            in={false}
+                            mountOnEnter={false}
+                            onEnter={[Function]}
+                            onEntered={[Function]}
+                            onEntering={[Function]}
+                            onExit={[Function]}
+                            onExited={[Function]}
+                            onExiting={[Function]}
+                            timeout={
+                              Object {
+                                "enter": 225,
+                                "exit": 195,
+                              }
+                            }
+                            unmountOnExit={false}
+                          >
+                            <WithStyles(ForwardRef(Paper))
+                              className="MuiDrawer-paper Drawer-drawerPaper-104 MuiDrawer-paperAnchorLeft MuiDrawer-paperAnchorDockedLeft"
+                              elevation={0}
+                              square={true}
+                              style={
+                                Object {
+                                  "visibility": undefined,
+                                }
+                              }
+                            >
+                              <ForwardRef(Paper)
+                                className="MuiDrawer-paper Drawer-drawerPaper-104 MuiDrawer-paperAnchorLeft MuiDrawer-paperAnchorDockedLeft"
+                                classes={
+                                  Object {
+                                    "elevation0": "MuiPaper-elevation0",
+                                    "elevation1": "MuiPaper-elevation1",
+                                    "elevation10": "MuiPaper-elevation10",
+                                    "elevation11": "MuiPaper-elevation11",
+                                    "elevation12": "MuiPaper-elevation12",
+                                    "elevation13": "MuiPaper-elevation13",
+                                    "elevation14": "MuiPaper-elevation14",
+                                    "elevation15": "MuiPaper-elevation15",
+                                    "elevation16": "MuiPaper-elevation16",
+                                    "elevation17": "MuiPaper-elevation17",
+                                    "elevation18": "MuiPaper-elevation18",
+                                    "elevation19": "MuiPaper-elevation19",
+                                    "elevation2": "MuiPaper-elevation2",
+                                    "elevation20": "MuiPaper-elevation20",
+                                    "elevation21": "MuiPaper-elevation21",
+                                    "elevation22": "MuiPaper-elevation22",
+                                    "elevation23": "MuiPaper-elevation23",
+                                    "elevation24": "MuiPaper-elevation24",
+                                    "elevation3": "MuiPaper-elevation3",
+                                    "elevation4": "MuiPaper-elevation4",
+                                    "elevation5": "MuiPaper-elevation5",
+                                    "elevation6": "MuiPaper-elevation6",
+                                    "elevation7": "MuiPaper-elevation7",
+                                    "elevation8": "MuiPaper-elevation8",
+                                    "elevation9": "MuiPaper-elevation9",
+                                    "root": "MuiPaper-root",
+                                    "rounded": "MuiPaper-rounded",
+                                  }
+                                }
+                                elevation={0}
+                                square={true}
+                                style={
+                                  Object {
+                                    "visibility": undefined,
+                                  }
+                                }
+                              >
+                                <div
+                                  className="MuiPaper-root MuiPaper-elevation0 MuiDrawer-paper Drawer-drawerPaper-104 MuiDrawer-paperAnchorLeft MuiDrawer-paperAnchorDockedLeft"
+                                  style={
+                                    Object {
+                                      "visibility": undefined,
+                                    }
+                                  }
+                                >
+                                  <div>
+                                    <div
+                                      className="Drawer-drawerHeader-105"
+                                    >
+                                      <WithStyles(ForwardRef(IconButton))
+                                        onClick={[Function]}
+                                      >
+                                        <ForwardRef(IconButton)
+                                          classes={
+                                            Object {
+                                              "colorInherit": "MuiIconButton-colorInherit",
+                                              "colorPrimary": "MuiIconButton-colorPrimary",
+                                              "colorSecondary": "MuiIconButton-colorSecondary",
+                                              "disabled": "Mui-disabled",
+                                              "edgeEnd": "MuiIconButton-edgeEnd",
+                                              "edgeStart": "MuiIconButton-edgeStart",
+                                              "label": "MuiIconButton-label",
+                                              "root": "MuiIconButton-root",
+                                              "sizeSmall": "MuiIconButton-sizeSmall",
+                                            }
+                                          }
+                                          onClick={[Function]}
+                                        >
+                                          <WithStyles(ForwardRef(ButtonBase))
+                                            centerRipple={true}
+                                            className="MuiIconButton-root"
+                                            disabled={false}
+                                            focusRipple={true}
+                                            onClick={[Function]}
+                                          >
+                                            <ForwardRef(ButtonBase)
+                                              centerRipple={true}
+                                              className="MuiIconButton-root"
+                                              classes={
+                                                Object {
+                                                  "disabled": "Mui-disabled",
+                                                  "focusVisible": "Mui-focusVisible",
+                                                  "root": "MuiButtonBase-root",
+                                                }
+                                              }
+                                              disabled={false}
+                                              focusRipple={true}
+                                              onClick={[Function]}
+                                            >
+                                              <button
+                                                className="MuiButtonBase-root MuiIconButton-root"
+                                                disabled={false}
+                                                onBlur={[Function]}
+                                                onClick={[Function]}
+                                                onFocus={[Function]}
+                                                onKeyDown={[Function]}
+                                                onKeyUp={[Function]}
+                                                onMouseDown={[Function]}
+                                                onMouseLeave={[Function]}
+                                                onMouseUp={[Function]}
+                                                onTouchEnd={[Function]}
+                                                onTouchMove={[Function]}
+                                                onTouchStart={[Function]}
+                                                tabIndex={0}
+                                                type="button"
+                                              >
+                                                <span
+                                                  className="MuiIconButton-label"
+                                                >
+                                                  <ForwardRef>
+                                                    <WithStyles(ForwardRef(SvgIcon))>
+                                                      <ForwardRef(SvgIcon)
+                                                        classes={
+                                                          Object {
+                                                            "colorAction": "MuiSvgIcon-colorAction",
+                                                            "colorDisabled": "MuiSvgIcon-colorDisabled",
+                                                            "colorError": "MuiSvgIcon-colorError",
+                                                            "colorPrimary": "MuiSvgIcon-colorPrimary",
+                                                            "colorSecondary": "MuiSvgIcon-colorSecondary",
+                                                            "fontSizeInherit": "MuiSvgIcon-fontSizeInherit",
+                                                            "fontSizeLarge": "MuiSvgIcon-fontSizeLarge",
+                                                            "fontSizeSmall": "MuiSvgIcon-fontSizeSmall",
+                                                            "root": "MuiSvgIcon-root",
+                                                          }
+                                                        }
+                                                      >
+                                                        <svg
+                                                          aria-hidden="true"
+                                                          className="MuiSvgIcon-root"
+                                                          focusable="false"
+                                                          role="presentation"
+                                                          viewBox="0 0 24 24"
+                                                        >
+                                                          <path
+                                                            d="M15.41 7.41L14 6l-6 6 6 6 1.41-1.41L10.83 12z"
+                                                          />
+                                                          <path
+                                                            d="M0 0h24v24H0z"
+                                                            fill="none"
+                                                          />
+                                                        </svg>
+                                                      </ForwardRef(SvgIcon)>
+                                                    </WithStyles(ForwardRef(SvgIcon))>
+                                                  </ForwardRef>
+                                                </span>
+                                                <NoSsr>
+                                                  <WithStyles(TouchRipple)
+                                                    center={true}
+                                                  >
+                                                    <TouchRipple
+                                                      center={true}
+                                                      classes={
+                                                        Object {
+                                                          "child": "MuiTouchRipple-child",
+                                                          "childLeaving": "MuiTouchRipple-childLeaving",
+                                                          "childPulsate": "MuiTouchRipple-childPulsate",
+                                                          "ripple": "MuiTouchRipple-ripple",
+                                                          "ripplePulsate": "MuiTouchRipple-ripplePulsate",
+                                                          "rippleVisible": "MuiTouchRipple-rippleVisible",
+                                                          "root": "MuiTouchRipple-root",
+                                                        }
+                                                      }
+                                                    >
+                                                      <span
+                                                        className="MuiTouchRipple-root"
+                                                      >
+                                                        <TransitionGroup
+                                                          childFactory={[Function]}
+                                                          component={null}
+                                                          enter={true}
+                                                          exit={true}
+                                                        />
+                                                      </span>
+                                                    </TouchRipple>
+                                                  </WithStyles(TouchRipple)>
+                                                </NoSsr>
+                                              </button>
+                                            </ForwardRef(ButtonBase)>
+                                          </WithStyles(ForwardRef(ButtonBase))>
+                                        </ForwardRef(IconButton)>
+                                      </WithStyles(ForwardRef(IconButton))>
+                                    </div>
+                                    <WithStyles(ForwardRef(Divider))>
+                                      <ForwardRef(Divider)
+                                        classes={
+                                          Object {
+                                            "absolute": "MuiDivider-absolute",
+                                            "inset": "MuiDivider-inset",
+                                            "light": "MuiDivider-light",
+                                            "middle": "MuiDivider-middle",
+                                            "root": "MuiDivider-root",
+                                          }
+                                        }
+                                      >
+                                        <hr
+                                          className="MuiDivider-root"
+                                        />
+                                      </ForwardRef(Divider)>
+                                    </WithStyles(ForwardRef(Divider))>
+                                    <WithStyles(Menu)
+                                      data={
+                                        Array [
+                                          Object {
+                                            "icon": null,
+                                            "title": "Dashboard",
+                                            "type": "link",
+                                            "url": "/",
+                                          },
+                                          Object {
+                                            "isDisabled": true,
+                                            "title": "New portfolio",
+                                            "type": "link",
+                                            "url": "/portfolio",
+                                          },
+                                          Object {
+                                            "type": "divider",
+                                          },
+                                          Object {
+                                            "icon": Object {
+                                              "$$typeof": Symbol(react.memo),
+                                              "compare": null,
+                                              "displayName": "BugReportIcon",
+                                              "muiName": "SvgIcon",
+                                              "type": Object {
+                                                "$$typeof": Symbol(react.forward_ref),
+                                                "render": [Function],
+                                              },
+                                            },
+                                            "title": "Report a bug",
+                                            "type": "link",
+                                            "url": "/bug",
+                                          },
+                                        ]
+                                      }
+                                      redirectTo={[Function]}
+                                    >
+                                      <Menu
+                                        classes={
+                                          Object {
+                                            "root": "Menu-root-123",
+                                          }
+                                        }
+                                        data={
+                                          Array [
+                                            Object {
+                                              "icon": null,
+                                              "title": "Dashboard",
+                                              "type": "link",
+                                              "url": "/",
+                                            },
+                                            Object {
+                                              "isDisabled": true,
+                                              "title": "New portfolio",
+                                              "type": "link",
+                                              "url": "/portfolio",
+                                            },
+                                            Object {
+                                              "type": "divider",
+                                            },
+                                            Object {
+                                              "icon": Object {
+                                                "$$typeof": Symbol(react.memo),
+                                                "compare": null,
+                                                "displayName": "BugReportIcon",
+                                                "muiName": "SvgIcon",
+                                                "type": Object {
+                                                  "$$typeof": Symbol(react.forward_ref),
+                                                  "render": [Function],
+                                                },
+                                              },
+                                              "title": "Report a bug",
+                                              "type": "link",
+                                              "url": "/bug",
+                                            },
+                                          ]
+                                        }
+                                        redirectTo={[Function]}
+                                      >
+                                        <div
+                                          className="Menu-root-123"
+                                        >
+                                          <WithStyles(ForwardRef(List))>
+                                            <ForwardRef(List)
+                                              classes={
+                                                Object {
+                                                  "dense": "MuiList-dense",
+                                                  "padding": "MuiList-padding",
+                                                  "root": "MuiList-root",
+                                                  "subheader": "MuiList-subheader",
+                                                }
+                                              }
+                                            >
+                                              <ul
+                                                className="MuiList-root MuiList-padding"
+                                              >
+                                                <WithStyles(MenuItem)
+                                                  icon={null}
+                                                  key="menu-22.71451"
+                                                  redirectTo={[Function]}
+                                                  title="Dashboard"
+                                                  url="/"
+                                                >
+                                                  <MenuItem
+                                                    classes={
+                                                      Object {
+                                                        "isDisabled": "MenuItem-isDisabled-128",
+                                                      }
+                                                    }
+                                                    icon={null}
+                                                    isDisabled={false}
+                                                    redirectTo={[Function]}
+                                                    title="Dashboard"
+                                                    url="/"
+                                                  >
+                                                    <WithStyles(ForwardRef(ListItem))
+                                                      button={true}
+                                                      className=""
+                                                      onClick={[Function]}
+                                                    >
+                                                      <ForwardRef(ListItem)
+                                                        button={true}
+                                                        className=""
+                                                        classes={
+                                                          Object {
+                                                            "alignItemsFlexStart": "MuiListItem-alignItemsFlexStart",
+                                                            "button": "MuiListItem-button",
+                                                            "container": "MuiListItem-container",
+                                                            "dense": "MuiListItem-dense",
+                                                            "disabled": "Mui-disabled",
+                                                            "divider": "MuiListItem-divider",
+                                                            "focusVisible": "Mui-focusVisible",
+                                                            "gutters": "MuiListItem-gutters",
+                                                            "root": "MuiListItem-root",
+                                                            "secondaryAction": "MuiListItem-secondaryAction",
+                                                            "selected": "Mui-selected",
+                                                          }
+                                                        }
+                                                        onClick={[Function]}
+                                                      >
+                                                        <WithStyles(ForwardRef(ButtonBase))
+                                                          className="MuiListItem-root MuiListItem-gutters MuiListItem-button"
+                                                          component="div"
+                                                          disabled={false}
+                                                          focusVisibleClassName="Mui-focusVisible"
+                                                          onClick={[Function]}
+                                                        >
+                                                          <ForwardRef(ButtonBase)
+                                                            className="MuiListItem-root MuiListItem-gutters MuiListItem-button"
+                                                            classes={
+                                                              Object {
+                                                                "disabled": "Mui-disabled",
+                                                                "focusVisible": "Mui-focusVisible",
+                                                                "root": "MuiButtonBase-root",
+                                                              }
+                                                            }
+                                                            component="div"
+                                                            disabled={false}
+                                                            focusVisibleClassName="Mui-focusVisible"
+                                                            onClick={[Function]}
+                                                          >
+                                                            <div
+                                                              aria-disabled={false}
+                                                              className="MuiButtonBase-root MuiListItem-root MuiListItem-gutters MuiListItem-button"
+                                                              onBlur={[Function]}
+                                                              onClick={[Function]}
+                                                              onFocus={[Function]}
+                                                              onKeyDown={[Function]}
+                                                              onKeyUp={[Function]}
+                                                              onMouseDown={[Function]}
+                                                              onMouseLeave={[Function]}
+                                                              onMouseUp={[Function]}
+                                                              onTouchEnd={[Function]}
+                                                              onTouchMove={[Function]}
+                                                              onTouchStart={[Function]}
+                                                              role="button"
+                                                              tabIndex={0}
+                                                            >
+                                                              <WithStyles(ForwardRef(ListItemText))
+                                                                key=".1"
+                                                                primary="Dashboard"
+                                                              >
+                                                                <ForwardRef(ListItemText)
+                                                                  classes={
+                                                                    Object {
+                                                                      "dense": "MuiListItemText-dense",
+                                                                      "inset": "MuiListItemText-inset",
+                                                                      "multiline": "MuiListItemText-multiline",
+                                                                      "primary": "MuiListItemText-primary",
+                                                                      "root": "MuiListItemText-root",
+                                                                      "secondary": "MuiListItemText-secondary",
+                                                                    }
+                                                                  }
+                                                                  primary="Dashboard"
+                                                                >
+                                                                  <div
+                                                                    className="MuiListItemText-root"
+                                                                  >
+                                                                    <WithStyles(ForwardRef(Typography))
+                                                                      className="MuiListItemText-primary"
+                                                                      component="span"
+                                                                      variant="body1"
+                                                                    >
+                                                                      <ForwardRef(Typography)
+                                                                        className="MuiListItemText-primary"
+                                                                        classes={
+                                                                          Object {
+                                                                            "alignCenter": "MuiTypography-alignCenter",
+                                                                            "alignJustify": "MuiTypography-alignJustify",
+                                                                            "alignLeft": "MuiTypography-alignLeft",
+                                                                            "alignRight": "MuiTypography-alignRight",
+                                                                            "body1": "MuiTypography-body1",
+                                                                            "body2": "MuiTypography-body2",
+                                                                            "button": "MuiTypography-button",
+                                                                            "caption": "MuiTypography-caption",
+                                                                            "colorError": "MuiTypography-colorError",
+                                                                            "colorInherit": "MuiTypography-colorInherit",
+                                                                            "colorPrimary": "MuiTypography-colorPrimary",
+                                                                            "colorSecondary": "MuiTypography-colorSecondary",
+                                                                            "colorTextPrimary": "MuiTypography-colorTextPrimary",
+                                                                            "colorTextSecondary": "MuiTypography-colorTextSecondary",
+                                                                            "displayBlock": "MuiTypography-displayBlock",
+                                                                            "displayInline": "MuiTypography-displayInline",
+                                                                            "gutterBottom": "MuiTypography-gutterBottom",
+                                                                            "h1": "MuiTypography-h1",
+                                                                            "h2": "MuiTypography-h2",
+                                                                            "h3": "MuiTypography-h3",
+                                                                            "h4": "MuiTypography-h4",
+                                                                            "h5": "MuiTypography-h5",
+                                                                            "h6": "MuiTypography-h6",
+                                                                            "noWrap": "MuiTypography-noWrap",
+                                                                            "overline": "MuiTypography-overline",
+                                                                            "paragraph": "MuiTypography-paragraph",
+                                                                            "root": "MuiTypography-root",
+                                                                            "srOnly": "MuiTypography-srOnly",
+                                                                            "subtitle1": "MuiTypography-subtitle1",
+                                                                            "subtitle2": "MuiTypography-subtitle2",
+                                                                          }
+                                                                        }
+                                                                        component="span"
+                                                                        theme={
+                                                                          Object {
+                                                                            "breakpoints": Object {
+                                                                              "between": [Function],
+                                                                              "down": [Function],
+                                                                              "keys": Array [
+                                                                                "xs",
+                                                                                "sm",
+                                                                                "md",
+                                                                                "lg",
+                                                                                "xl",
+                                                                              ],
+                                                                              "only": [Function],
+                                                                              "up": [Function],
+                                                                              "values": Object {
+                                                                                "lg": 1280,
+                                                                                "md": 960,
+                                                                                "sm": 600,
+                                                                                "xl": 1920,
+                                                                                "xs": 0,
+                                                                              },
+                                                                              "width": [Function],
+                                                                            },
+                                                                            "direction": "ltr",
+                                                                            "mixins": Object {
+                                                                              "gutters": [Function],
+                                                                              "toolbar": Object {
+                                                                                "@media (min-width:0px) and (orientation: landscape)": Object {
+                                                                                  "minHeight": 48,
+                                                                                },
+                                                                                "@media (min-width:600px)": Object {
+                                                                                  "minHeight": 64,
+                                                                                },
+                                                                                "minHeight": 56,
+                                                                              },
+                                                                            },
+                                                                            "overrides": Object {},
+                                                                            "palette": Object {
+                                                                              "action": Object {
+                                                                                "active": "rgba(0, 0, 0, 0.54)",
+                                                                                "disabled": "rgba(0, 0, 0, 0.26)",
+                                                                                "disabledBackground": "rgba(0, 0, 0, 0.12)",
+                                                                                "hover": "rgba(0, 0, 0, 0.08)",
+                                                                                "hoverOpacity": 0.08,
+                                                                                "selected": "rgba(0, 0, 0, 0.14)",
+                                                                              },
+                                                                              "augmentColor": [Function],
+                                                                              "background": Object {
+                                                                                "default": "#fafafa",
+                                                                                "paper": "#fff",
+                                                                              },
+                                                                              "common": Object {
+                                                                                "black": "#000",
+                                                                                "white": "#fff",
+                                                                              },
+                                                                              "contrastThreshold": 3,
+                                                                              "divider": "rgba(0, 0, 0, 0.12)",
+                                                                              "error": Object {
+                                                                                "contrastText": "#fff",
+                                                                                "dark": "#d32f2f",
+                                                                                "light": "#e57373",
+                                                                                "main": "#f44336",
+                                                                              },
+                                                                              "getContrastText": [Function],
+                                                                              "grey": Object {
+                                                                                "100": "#f5f5f5",
+                                                                                "200": "#eeeeee",
+                                                                                "300": "#e0e0e0",
+                                                                                "400": "#bdbdbd",
+                                                                                "50": "#fafafa",
+                                                                                "500": "#9e9e9e",
+                                                                                "600": "#757575",
+                                                                                "700": "#616161",
+                                                                                "800": "#424242",
+                                                                                "900": "#212121",
+                                                                                "A100": "#d5d5d5",
+                                                                                "A200": "#aaaaaa",
+                                                                                "A400": "#303030",
+                                                                                "A700": "#616161",
+                                                                              },
+                                                                              "primary": Object {
+                                                                                "contrastText": "#fff",
+                                                                                "dark": "#303f9f",
+                                                                                "light": "#7986cb",
+                                                                                "main": "#3f51b5",
+                                                                              },
+                                                                              "secondary": Object {
+                                                                                "contrastText": "#fff",
+                                                                                "dark": "#c51162",
+                                                                                "light": "#ff4081",
+                                                                                "main": "#f50057",
+                                                                              },
+                                                                              "text": Object {
+                                                                                "disabled": "rgba(0, 0, 0, 0.38)",
+                                                                                "hint": "rgba(0, 0, 0, 0.38)",
+                                                                                "primary": "rgba(0, 0, 0, 0.87)",
+                                                                                "secondary": "rgba(0, 0, 0, 0.54)",
+                                                                              },
+                                                                              "tonalOffset": 0.2,
+                                                                              "type": "light",
+                                                                            },
+                                                                            "props": Object {},
+                                                                            "shadows": Array [
+                                                                              "none",
+                                                                              "0px 1px 3px 0px rgba(0,0,0,0.2),0px 1px 1px 0px rgba(0,0,0,0.14),0px 2px 1px -1px rgba(0,0,0,0.12)",
+                                                                              "0px 1px 5px 0px rgba(0,0,0,0.2),0px 2px 2px 0px rgba(0,0,0,0.14),0px 3px 1px -2px rgba(0,0,0,0.12)",
+                                                                              "0px 1px 8px 0px rgba(0,0,0,0.2),0px 3px 4px 0px rgba(0,0,0,0.14),0px 3px 3px -2px rgba(0,0,0,0.12)",
+                                                                              "0px 2px 4px -1px rgba(0,0,0,0.2),0px 4px 5px 0px rgba(0,0,0,0.14),0px 1px 10px 0px rgba(0,0,0,0.12)",
+                                                                              "0px 3px 5px -1px rgba(0,0,0,0.2),0px 5px 8px 0px rgba(0,0,0,0.14),0px 1px 14px 0px rgba(0,0,0,0.12)",
+                                                                              "0px 3px 5px -1px rgba(0,0,0,0.2),0px 6px 10px 0px rgba(0,0,0,0.14),0px 1px 18px 0px rgba(0,0,0,0.12)",
+                                                                              "0px 4px 5px -2px rgba(0,0,0,0.2),0px 7px 10px 1px rgba(0,0,0,0.14),0px 2px 16px 1px rgba(0,0,0,0.12)",
+                                                                              "0px 5px 5px -3px rgba(0,0,0,0.2),0px 8px 10px 1px rgba(0,0,0,0.14),0px 3px 14px 2px rgba(0,0,0,0.12)",
+                                                                              "0px 5px 6px -3px rgba(0,0,0,0.2),0px 9px 12px 1px rgba(0,0,0,0.14),0px 3px 16px 2px rgba(0,0,0,0.12)",
+                                                                              "0px 6px 6px -3px rgba(0,0,0,0.2),0px 10px 14px 1px rgba(0,0,0,0.14),0px 4px 18px 3px rgba(0,0,0,0.12)",
+                                                                              "0px 6px 7px -4px rgba(0,0,0,0.2),0px 11px 15px 1px rgba(0,0,0,0.14),0px 4px 20px 3px rgba(0,0,0,0.12)",
+                                                                              "0px 7px 8px -4px rgba(0,0,0,0.2),0px 12px 17px 2px rgba(0,0,0,0.14),0px 5px 22px 4px rgba(0,0,0,0.12)",
+                                                                              "0px 7px 8px -4px rgba(0,0,0,0.2),0px 13px 19px 2px rgba(0,0,0,0.14),0px 5px 24px 4px rgba(0,0,0,0.12)",
+                                                                              "0px 7px 9px -4px rgba(0,0,0,0.2),0px 14px 21px 2px rgba(0,0,0,0.14),0px 5px 26px 4px rgba(0,0,0,0.12)",
+                                                                              "0px 8px 9px -5px rgba(0,0,0,0.2),0px 15px 22px 2px rgba(0,0,0,0.14),0px 6px 28px 5px rgba(0,0,0,0.12)",
+                                                                              "0px 8px 10px -5px rgba(0,0,0,0.2),0px 16px 24px 2px rgba(0,0,0,0.14),0px 6px 30px 5px rgba(0,0,0,0.12)",
+                                                                              "0px 8px 11px -5px rgba(0,0,0,0.2),0px 17px 26px 2px rgba(0,0,0,0.14),0px 6px 32px 5px rgba(0,0,0,0.12)",
+                                                                              "0px 9px 11px -5px rgba(0,0,0,0.2),0px 18px 28px 2px rgba(0,0,0,0.14),0px 7px 34px 6px rgba(0,0,0,0.12)",
+                                                                              "0px 9px 12px -6px rgba(0,0,0,0.2),0px 19px 29px 2px rgba(0,0,0,0.14),0px 7px 36px 6px rgba(0,0,0,0.12)",
+                                                                              "0px 10px 13px -6px rgba(0,0,0,0.2),0px 20px 31px 3px rgba(0,0,0,0.14),0px 8px 38px 7px rgba(0,0,0,0.12)",
+                                                                              "0px 10px 13px -6px rgba(0,0,0,0.2),0px 21px 33px 3px rgba(0,0,0,0.14),0px 8px 40px 7px rgba(0,0,0,0.12)",
+                                                                              "0px 10px 14px -6px rgba(0,0,0,0.2),0px 22px 35px 3px rgba(0,0,0,0.14),0px 8px 42px 7px rgba(0,0,0,0.12)",
+                                                                              "0px 11px 14px -7px rgba(0,0,0,0.2),0px 23px 36px 3px rgba(0,0,0,0.14),0px 9px 44px 8px rgba(0,0,0,0.12)",
+                                                                              "0px 11px 15px -7px rgba(0,0,0,0.2),0px 24px 38px 3px rgba(0,0,0,0.14),0px 9px 46px 8px rgba(0,0,0,0.12)",
+                                                                            ],
+                                                                            "shape": Object {
+                                                                              "borderRadius": 4,
+                                                                            },
+                                                                            "spacing": [Function],
+                                                                            "transitions": Object {
+                                                                              "create": [Function],
+                                                                              "duration": Object {
+                                                                                "complex": 375,
+                                                                                "enteringScreen": 225,
+                                                                                "leavingScreen": 195,
+                                                                                "short": 250,
+                                                                                "shorter": 200,
+                                                                                "shortest": 150,
+                                                                                "standard": 300,
+                                                                              },
+                                                                              "easing": Object {
+                                                                                "easeIn": "cubic-bezier(0.4, 0, 1, 1)",
+                                                                                "easeInOut": "cubic-bezier(0.4, 0, 0.2, 1)",
+                                                                                "easeOut": "cubic-bezier(0.0, 0, 0.2, 1)",
+                                                                                "sharp": "cubic-bezier(0.4, 0, 0.6, 1)",
+                                                                              },
+                                                                              "getAutoHeightDuration": [Function],
+                                                                            },
+                                                                            "typography": Object {
+                                                                              "body1": Object {
+                                                                                "fontFamily": "\\"Roboto\\", \\"Helvetica\\", \\"Arial\\", sans-serif",
+                                                                                "fontSize": "1rem",
+                                                                                "fontWeight": 400,
+                                                                                "letterSpacing": "0.00938em",
+                                                                                "lineHeight": 1.5,
+                                                                              },
+                                                                              "body2": Object {
+                                                                                "fontFamily": "\\"Roboto\\", \\"Helvetica\\", \\"Arial\\", sans-serif",
+                                                                                "fontSize": "0.875rem",
+                                                                                "fontWeight": 400,
+                                                                                "letterSpacing": "0.01071em",
+                                                                                "lineHeight": 1.43,
+                                                                              },
+                                                                              "button": Object {
+                                                                                "fontFamily": "\\"Roboto\\", \\"Helvetica\\", \\"Arial\\", sans-serif",
+                                                                                "fontSize": "0.875rem",
+                                                                                "fontWeight": 500,
+                                                                                "letterSpacing": "0.02857em",
+                                                                                "lineHeight": 1.75,
+                                                                                "textTransform": "uppercase",
+                                                                              },
+                                                                              "caption": Object {
+                                                                                "fontFamily": "\\"Roboto\\", \\"Helvetica\\", \\"Arial\\", sans-serif",
+                                                                                "fontSize": "0.75rem",
+                                                                                "fontWeight": 400,
+                                                                                "letterSpacing": "0.03333em",
+                                                                                "lineHeight": 1.66,
+                                                                              },
+                                                                              "fontFamily": "\\"Roboto\\", \\"Helvetica\\", \\"Arial\\", sans-serif",
+                                                                              "fontSize": 14,
+                                                                              "fontWeightBold": 700,
+                                                                              "fontWeightLight": 300,
+                                                                              "fontWeightMedium": 500,
+                                                                              "fontWeightRegular": 400,
+                                                                              "h1": Object {
+                                                                                "fontFamily": "\\"Roboto\\", \\"Helvetica\\", \\"Arial\\", sans-serif",
+                                                                                "fontSize": "6rem",
+                                                                                "fontWeight": 300,
+                                                                                "letterSpacing": "-0.01562em",
+                                                                                "lineHeight": 1,
+                                                                              },
+                                                                              "h2": Object {
+                                                                                "fontFamily": "\\"Roboto\\", \\"Helvetica\\", \\"Arial\\", sans-serif",
+                                                                                "fontSize": "3.75rem",
+                                                                                "fontWeight": 300,
+                                                                                "letterSpacing": "-0.00833em",
+                                                                                "lineHeight": 1,
+                                                                              },
+                                                                              "h3": Object {
+                                                                                "fontFamily": "\\"Roboto\\", \\"Helvetica\\", \\"Arial\\", sans-serif",
+                                                                                "fontSize": "3rem",
+                                                                                "fontWeight": 400,
+                                                                                "letterSpacing": "0em",
+                                                                                "lineHeight": 1.04,
+                                                                              },
+                                                                              "h4": Object {
+                                                                                "fontFamily": "\\"Roboto\\", \\"Helvetica\\", \\"Arial\\", sans-serif",
+                                                                                "fontSize": "2.125rem",
+                                                                                "fontWeight": 400,
+                                                                                "letterSpacing": "0.00735em",
+                                                                                "lineHeight": 1.17,
+                                                                              },
+                                                                              "h5": Object {
+                                                                                "fontFamily": "\\"Roboto\\", \\"Helvetica\\", \\"Arial\\", sans-serif",
+                                                                                "fontSize": "1.5rem",
+                                                                                "fontWeight": 400,
+                                                                                "letterSpacing": "0em",
+                                                                                "lineHeight": 1.33,
+                                                                              },
+                                                                              "h6": Object {
+                                                                                "fontFamily": "\\"Roboto\\", \\"Helvetica\\", \\"Arial\\", sans-serif",
+                                                                                "fontSize": "1.25rem",
+                                                                                "fontWeight": 500,
+                                                                                "letterSpacing": "0.0075em",
+                                                                                "lineHeight": 1.6,
+                                                                              },
+                                                                              "htmlFontSize": 16,
+                                                                              "overline": Object {
+                                                                                "fontFamily": "\\"Roboto\\", \\"Helvetica\\", \\"Arial\\", sans-serif",
+                                                                                "fontSize": "0.75rem",
+                                                                                "fontWeight": 400,
+                                                                                "letterSpacing": "0.08333em",
+                                                                                "lineHeight": 2.66,
+                                                                                "textTransform": "uppercase",
+                                                                              },
+                                                                              "pxToRem": [Function],
+                                                                              "round": [Function],
+                                                                              "subtitle1": Object {
+                                                                                "fontFamily": "\\"Roboto\\", \\"Helvetica\\", \\"Arial\\", sans-serif",
+                                                                                "fontSize": "1rem",
+                                                                                "fontWeight": 400,
+                                                                                "letterSpacing": "0.00938em",
+                                                                                "lineHeight": 1.75,
+                                                                              },
+                                                                              "subtitle2": Object {
+                                                                                "fontFamily": "\\"Roboto\\", \\"Helvetica\\", \\"Arial\\", sans-serif",
+                                                                                "fontSize": "0.875rem",
+                                                                                "fontWeight": 500,
+                                                                                "letterSpacing": "0.00714em",
+                                                                                "lineHeight": 1.57,
+                                                                              },
+                                                                            },
+                                                                            "zIndex": Object {
+                                                                              "appBar": 1100,
+                                                                              "drawer": 1200,
+                                                                              "mobileStepper": 1000,
+                                                                              "modal": 1300,
+                                                                              "snackbar": 1400,
+                                                                              "tooltip": 1500,
+                                                                            },
+                                                                          }
+                                                                        }
+                                                                        variant="body1"
+                                                                      >
+                                                                        <span
+                                                                          className="MuiTypography-root MuiListItemText-primary MuiTypography-body1"
+                                                                        >
+                                                                          Dashboard
+                                                                        </span>
+                                                                      </ForwardRef(Typography)>
+                                                                    </WithStyles(ForwardRef(Typography))>
+                                                                  </div>
+                                                                </ForwardRef(ListItemText)>
+                                                              </WithStyles(ForwardRef(ListItemText))>
+                                                              <NoSsr>
+                                                                <WithStyles(TouchRipple)
+                                                                  center={false}
+                                                                >
+                                                                  <TouchRipple
+                                                                    center={false}
+                                                                    classes={
+                                                                      Object {
+                                                                        "child": "MuiTouchRipple-child",
+                                                                        "childLeaving": "MuiTouchRipple-childLeaving",
+                                                                        "childPulsate": "MuiTouchRipple-childPulsate",
+                                                                        "ripple": "MuiTouchRipple-ripple",
+                                                                        "ripplePulsate": "MuiTouchRipple-ripplePulsate",
+                                                                        "rippleVisible": "MuiTouchRipple-rippleVisible",
+                                                                        "root": "MuiTouchRipple-root",
+                                                                      }
+                                                                    }
+                                                                  >
+                                                                    <span
+                                                                      className="MuiTouchRipple-root"
+                                                                    >
+                                                                      <TransitionGroup
+                                                                        childFactory={[Function]}
+                                                                        component={null}
+                                                                        enter={true}
+                                                                        exit={true}
+                                                                      />
+                                                                    </span>
+                                                                  </TouchRipple>
+                                                                </WithStyles(TouchRipple)>
+                                                              </NoSsr>
+                                                            </div>
+                                                          </ForwardRef(ButtonBase)>
+                                                        </WithStyles(ForwardRef(ButtonBase))>
+                                                      </ForwardRef(ListItem)>
+                                                    </WithStyles(ForwardRef(ListItem))>
+                                                  </MenuItem>
+                                                </WithStyles(MenuItem)>
+                                                <WithStyles(MenuItem)
+                                                  isDisabled={true}
+                                                  key="menu-11.49698"
+                                                  redirectTo={[Function]}
+                                                  title="New portfolio"
+                                                  url="/portfolio"
+                                                >
+                                                  <MenuItem
+                                                    classes={
+                                                      Object {
+                                                        "isDisabled": "MenuItem-isDisabled-128",
+                                                      }
+                                                    }
+                                                    icon={null}
+                                                    isDisabled={true}
+                                                    redirectTo={[Function]}
+                                                    title="New portfolio"
+                                                    url="/portfolio"
+                                                  >
+                                                    <WithStyles(ForwardRef(ListItem))
+                                                      button={true}
+                                                      className="MenuItem-isDisabled-128"
+                                                      onClick={[Function]}
+                                                    >
+                                                      <ForwardRef(ListItem)
+                                                        button={true}
+                                                        className="MenuItem-isDisabled-128"
+                                                        classes={
+                                                          Object {
+                                                            "alignItemsFlexStart": "MuiListItem-alignItemsFlexStart",
+                                                            "button": "MuiListItem-button",
+                                                            "container": "MuiListItem-container",
+                                                            "dense": "MuiListItem-dense",
+                                                            "disabled": "Mui-disabled",
+                                                            "divider": "MuiListItem-divider",
+                                                            "focusVisible": "Mui-focusVisible",
+                                                            "gutters": "MuiListItem-gutters",
+                                                            "root": "MuiListItem-root",
+                                                            "secondaryAction": "MuiListItem-secondaryAction",
+                                                            "selected": "Mui-selected",
+                                                          }
+                                                        }
+                                                        onClick={[Function]}
+                                                      >
+                                                        <WithStyles(ForwardRef(ButtonBase))
+                                                          className="MuiListItem-root MenuItem-isDisabled-128 MuiListItem-gutters MuiListItem-button"
+                                                          component="div"
+                                                          disabled={false}
+                                                          focusVisibleClassName="Mui-focusVisible"
+                                                          onClick={[Function]}
+                                                        >
+                                                          <ForwardRef(ButtonBase)
+                                                            className="MuiListItem-root MenuItem-isDisabled-128 MuiListItem-gutters MuiListItem-button"
+                                                            classes={
+                                                              Object {
+                                                                "disabled": "Mui-disabled",
+                                                                "focusVisible": "Mui-focusVisible",
+                                                                "root": "MuiButtonBase-root",
+                                                              }
+                                                            }
+                                                            component="div"
+                                                            disabled={false}
+                                                            focusVisibleClassName="Mui-focusVisible"
+                                                            onClick={[Function]}
+                                                          >
+                                                            <div
+                                                              aria-disabled={false}
+                                                              className="MuiButtonBase-root MuiListItem-root MenuItem-isDisabled-128 MuiListItem-gutters MuiListItem-button"
+                                                              onBlur={[Function]}
+                                                              onClick={[Function]}
+                                                              onFocus={[Function]}
+                                                              onKeyDown={[Function]}
+                                                              onKeyUp={[Function]}
+                                                              onMouseDown={[Function]}
+                                                              onMouseLeave={[Function]}
+                                                              onMouseUp={[Function]}
+                                                              onTouchEnd={[Function]}
+                                                              onTouchMove={[Function]}
+                                                              onTouchStart={[Function]}
+                                                              role="button"
+                                                              tabIndex={0}
+                                                            >
+                                                              <WithStyles(ForwardRef(ListItemText))
+                                                                key=".1"
+                                                                primary="New portfolio"
+                                                              >
+                                                                <ForwardRef(ListItemText)
+                                                                  classes={
+                                                                    Object {
+                                                                      "dense": "MuiListItemText-dense",
+                                                                      "inset": "MuiListItemText-inset",
+                                                                      "multiline": "MuiListItemText-multiline",
+                                                                      "primary": "MuiListItemText-primary",
+                                                                      "root": "MuiListItemText-root",
+                                                                      "secondary": "MuiListItemText-secondary",
+                                                                    }
+                                                                  }
+                                                                  primary="New portfolio"
+                                                                >
+                                                                  <div
+                                                                    className="MuiListItemText-root"
+                                                                  >
+                                                                    <WithStyles(ForwardRef(Typography))
+                                                                      className="MuiListItemText-primary"
+                                                                      component="span"
+                                                                      variant="body1"
+                                                                    >
+                                                                      <ForwardRef(Typography)
+                                                                        className="MuiListItemText-primary"
+                                                                        classes={
+                                                                          Object {
+                                                                            "alignCenter": "MuiTypography-alignCenter",
+                                                                            "alignJustify": "MuiTypography-alignJustify",
+                                                                            "alignLeft": "MuiTypography-alignLeft",
+                                                                            "alignRight": "MuiTypography-alignRight",
+                                                                            "body1": "MuiTypography-body1",
+                                                                            "body2": "MuiTypography-body2",
+                                                                            "button": "MuiTypography-button",
+                                                                            "caption": "MuiTypography-caption",
+                                                                            "colorError": "MuiTypography-colorError",
+                                                                            "colorInherit": "MuiTypography-colorInherit",
+                                                                            "colorPrimary": "MuiTypography-colorPrimary",
+                                                                            "colorSecondary": "MuiTypography-colorSecondary",
+                                                                            "colorTextPrimary": "MuiTypography-colorTextPrimary",
+                                                                            "colorTextSecondary": "MuiTypography-colorTextSecondary",
+                                                                            "displayBlock": "MuiTypography-displayBlock",
+                                                                            "displayInline": "MuiTypography-displayInline",
+                                                                            "gutterBottom": "MuiTypography-gutterBottom",
+                                                                            "h1": "MuiTypography-h1",
+                                                                            "h2": "MuiTypography-h2",
+                                                                            "h3": "MuiTypography-h3",
+                                                                            "h4": "MuiTypography-h4",
+                                                                            "h5": "MuiTypography-h5",
+                                                                            "h6": "MuiTypography-h6",
+                                                                            "noWrap": "MuiTypography-noWrap",
+                                                                            "overline": "MuiTypography-overline",
+                                                                            "paragraph": "MuiTypography-paragraph",
+                                                                            "root": "MuiTypography-root",
+                                                                            "srOnly": "MuiTypography-srOnly",
+                                                                            "subtitle1": "MuiTypography-subtitle1",
+                                                                            "subtitle2": "MuiTypography-subtitle2",
+                                                                          }
+                                                                        }
+                                                                        component="span"
+                                                                        theme={
+                                                                          Object {
+                                                                            "breakpoints": Object {
+                                                                              "between": [Function],
+                                                                              "down": [Function],
+                                                                              "keys": Array [
+                                                                                "xs",
+                                                                                "sm",
+                                                                                "md",
+                                                                                "lg",
+                                                                                "xl",
+                                                                              ],
+                                                                              "only": [Function],
+                                                                              "up": [Function],
+                                                                              "values": Object {
+                                                                                "lg": 1280,
+                                                                                "md": 960,
+                                                                                "sm": 600,
+                                                                                "xl": 1920,
+                                                                                "xs": 0,
+                                                                              },
+                                                                              "width": [Function],
+                                                                            },
+                                                                            "direction": "ltr",
+                                                                            "mixins": Object {
+                                                                              "gutters": [Function],
+                                                                              "toolbar": Object {
+                                                                                "@media (min-width:0px) and (orientation: landscape)": Object {
+                                                                                  "minHeight": 48,
+                                                                                },
+                                                                                "@media (min-width:600px)": Object {
+                                                                                  "minHeight": 64,
+                                                                                },
+                                                                                "minHeight": 56,
+                                                                              },
+                                                                            },
+                                                                            "overrides": Object {},
+                                                                            "palette": Object {
+                                                                              "action": Object {
+                                                                                "active": "rgba(0, 0, 0, 0.54)",
+                                                                                "disabled": "rgba(0, 0, 0, 0.26)",
+                                                                                "disabledBackground": "rgba(0, 0, 0, 0.12)",
+                                                                                "hover": "rgba(0, 0, 0, 0.08)",
+                                                                                "hoverOpacity": 0.08,
+                                                                                "selected": "rgba(0, 0, 0, 0.14)",
+                                                                              },
+                                                                              "augmentColor": [Function],
+                                                                              "background": Object {
+                                                                                "default": "#fafafa",
+                                                                                "paper": "#fff",
+                                                                              },
+                                                                              "common": Object {
+                                                                                "black": "#000",
+                                                                                "white": "#fff",
+                                                                              },
+                                                                              "contrastThreshold": 3,
+                                                                              "divider": "rgba(0, 0, 0, 0.12)",
+                                                                              "error": Object {
+                                                                                "contrastText": "#fff",
+                                                                                "dark": "#d32f2f",
+                                                                                "light": "#e57373",
+                                                                                "main": "#f44336",
+                                                                              },
+                                                                              "getContrastText": [Function],
+                                                                              "grey": Object {
+                                                                                "100": "#f5f5f5",
+                                                                                "200": "#eeeeee",
+                                                                                "300": "#e0e0e0",
+                                                                                "400": "#bdbdbd",
+                                                                                "50": "#fafafa",
+                                                                                "500": "#9e9e9e",
+                                                                                "600": "#757575",
+                                                                                "700": "#616161",
+                                                                                "800": "#424242",
+                                                                                "900": "#212121",
+                                                                                "A100": "#d5d5d5",
+                                                                                "A200": "#aaaaaa",
+                                                                                "A400": "#303030",
+                                                                                "A700": "#616161",
+                                                                              },
+                                                                              "primary": Object {
+                                                                                "contrastText": "#fff",
+                                                                                "dark": "#303f9f",
+                                                                                "light": "#7986cb",
+                                                                                "main": "#3f51b5",
+                                                                              },
+                                                                              "secondary": Object {
+                                                                                "contrastText": "#fff",
+                                                                                "dark": "#c51162",
+                                                                                "light": "#ff4081",
+                                                                                "main": "#f50057",
+                                                                              },
+                                                                              "text": Object {
+                                                                                "disabled": "rgba(0, 0, 0, 0.38)",
+                                                                                "hint": "rgba(0, 0, 0, 0.38)",
+                                                                                "primary": "rgba(0, 0, 0, 0.87)",
+                                                                                "secondary": "rgba(0, 0, 0, 0.54)",
+                                                                              },
+                                                                              "tonalOffset": 0.2,
+                                                                              "type": "light",
+                                                                            },
+                                                                            "props": Object {},
+                                                                            "shadows": Array [
+                                                                              "none",
+                                                                              "0px 1px 3px 0px rgba(0,0,0,0.2),0px 1px 1px 0px rgba(0,0,0,0.14),0px 2px 1px -1px rgba(0,0,0,0.12)",
+                                                                              "0px 1px 5px 0px rgba(0,0,0,0.2),0px 2px 2px 0px rgba(0,0,0,0.14),0px 3px 1px -2px rgba(0,0,0,0.12)",
+                                                                              "0px 1px 8px 0px rgba(0,0,0,0.2),0px 3px 4px 0px rgba(0,0,0,0.14),0px 3px 3px -2px rgba(0,0,0,0.12)",
+                                                                              "0px 2px 4px -1px rgba(0,0,0,0.2),0px 4px 5px 0px rgba(0,0,0,0.14),0px 1px 10px 0px rgba(0,0,0,0.12)",
+                                                                              "0px 3px 5px -1px rgba(0,0,0,0.2),0px 5px 8px 0px rgba(0,0,0,0.14),0px 1px 14px 0px rgba(0,0,0,0.12)",
+                                                                              "0px 3px 5px -1px rgba(0,0,0,0.2),0px 6px 10px 0px rgba(0,0,0,0.14),0px 1px 18px 0px rgba(0,0,0,0.12)",
+                                                                              "0px 4px 5px -2px rgba(0,0,0,0.2),0px 7px 10px 1px rgba(0,0,0,0.14),0px 2px 16px 1px rgba(0,0,0,0.12)",
+                                                                              "0px 5px 5px -3px rgba(0,0,0,0.2),0px 8px 10px 1px rgba(0,0,0,0.14),0px 3px 14px 2px rgba(0,0,0,0.12)",
+                                                                              "0px 5px 6px -3px rgba(0,0,0,0.2),0px 9px 12px 1px rgba(0,0,0,0.14),0px 3px 16px 2px rgba(0,0,0,0.12)",
+                                                                              "0px 6px 6px -3px rgba(0,0,0,0.2),0px 10px 14px 1px rgba(0,0,0,0.14),0px 4px 18px 3px rgba(0,0,0,0.12)",
+                                                                              "0px 6px 7px -4px rgba(0,0,0,0.2),0px 11px 15px 1px rgba(0,0,0,0.14),0px 4px 20px 3px rgba(0,0,0,0.12)",
+                                                                              "0px 7px 8px -4px rgba(0,0,0,0.2),0px 12px 17px 2px rgba(0,0,0,0.14),0px 5px 22px 4px rgba(0,0,0,0.12)",
+                                                                              "0px 7px 8px -4px rgba(0,0,0,0.2),0px 13px 19px 2px rgba(0,0,0,0.14),0px 5px 24px 4px rgba(0,0,0,0.12)",
+                                                                              "0px 7px 9px -4px rgba(0,0,0,0.2),0px 14px 21px 2px rgba(0,0,0,0.14),0px 5px 26px 4px rgba(0,0,0,0.12)",
+                                                                              "0px 8px 9px -5px rgba(0,0,0,0.2),0px 15px 22px 2px rgba(0,0,0,0.14),0px 6px 28px 5px rgba(0,0,0,0.12)",
+                                                                              "0px 8px 10px -5px rgba(0,0,0,0.2),0px 16px 24px 2px rgba(0,0,0,0.14),0px 6px 30px 5px rgba(0,0,0,0.12)",
+                                                                              "0px 8px 11px -5px rgba(0,0,0,0.2),0px 17px 26px 2px rgba(0,0,0,0.14),0px 6px 32px 5px rgba(0,0,0,0.12)",
+                                                                              "0px 9px 11px -5px rgba(0,0,0,0.2),0px 18px 28px 2px rgba(0,0,0,0.14),0px 7px 34px 6px rgba(0,0,0,0.12)",
+                                                                              "0px 9px 12px -6px rgba(0,0,0,0.2),0px 19px 29px 2px rgba(0,0,0,0.14),0px 7px 36px 6px rgba(0,0,0,0.12)",
+                                                                              "0px 10px 13px -6px rgba(0,0,0,0.2),0px 20px 31px 3px rgba(0,0,0,0.14),0px 8px 38px 7px rgba(0,0,0,0.12)",
+                                                                              "0px 10px 13px -6px rgba(0,0,0,0.2),0px 21px 33px 3px rgba(0,0,0,0.14),0px 8px 40px 7px rgba(0,0,0,0.12)",
+                                                                              "0px 10px 14px -6px rgba(0,0,0,0.2),0px 22px 35px 3px rgba(0,0,0,0.14),0px 8px 42px 7px rgba(0,0,0,0.12)",
+                                                                              "0px 11px 14px -7px rgba(0,0,0,0.2),0px 23px 36px 3px rgba(0,0,0,0.14),0px 9px 44px 8px rgba(0,0,0,0.12)",
+                                                                              "0px 11px 15px -7px rgba(0,0,0,0.2),0px 24px 38px 3px rgba(0,0,0,0.14),0px 9px 46px 8px rgba(0,0,0,0.12)",
+                                                                            ],
+                                                                            "shape": Object {
+                                                                              "borderRadius": 4,
+                                                                            },
+                                                                            "spacing": [Function],
+                                                                            "transitions": Object {
+                                                                              "create": [Function],
+                                                                              "duration": Object {
+                                                                                "complex": 375,
+                                                                                "enteringScreen": 225,
+                                                                                "leavingScreen": 195,
+                                                                                "short": 250,
+                                                                                "shorter": 200,
+                                                                                "shortest": 150,
+                                                                                "standard": 300,
+                                                                              },
+                                                                              "easing": Object {
+                                                                                "easeIn": "cubic-bezier(0.4, 0, 1, 1)",
+                                                                                "easeInOut": "cubic-bezier(0.4, 0, 0.2, 1)",
+                                                                                "easeOut": "cubic-bezier(0.0, 0, 0.2, 1)",
+                                                                                "sharp": "cubic-bezier(0.4, 0, 0.6, 1)",
+                                                                              },
+                                                                              "getAutoHeightDuration": [Function],
+                                                                            },
+                                                                            "typography": Object {
+                                                                              "body1": Object {
+                                                                                "fontFamily": "\\"Roboto\\", \\"Helvetica\\", \\"Arial\\", sans-serif",
+                                                                                "fontSize": "1rem",
+                                                                                "fontWeight": 400,
+                                                                                "letterSpacing": "0.00938em",
+                                                                                "lineHeight": 1.5,
+                                                                              },
+                                                                              "body2": Object {
+                                                                                "fontFamily": "\\"Roboto\\", \\"Helvetica\\", \\"Arial\\", sans-serif",
+                                                                                "fontSize": "0.875rem",
+                                                                                "fontWeight": 400,
+                                                                                "letterSpacing": "0.01071em",
+                                                                                "lineHeight": 1.43,
+                                                                              },
+                                                                              "button": Object {
+                                                                                "fontFamily": "\\"Roboto\\", \\"Helvetica\\", \\"Arial\\", sans-serif",
+                                                                                "fontSize": "0.875rem",
+                                                                                "fontWeight": 500,
+                                                                                "letterSpacing": "0.02857em",
+                                                                                "lineHeight": 1.75,
+                                                                                "textTransform": "uppercase",
+                                                                              },
+                                                                              "caption": Object {
+                                                                                "fontFamily": "\\"Roboto\\", \\"Helvetica\\", \\"Arial\\", sans-serif",
+                                                                                "fontSize": "0.75rem",
+                                                                                "fontWeight": 400,
+                                                                                "letterSpacing": "0.03333em",
+                                                                                "lineHeight": 1.66,
+                                                                              },
+                                                                              "fontFamily": "\\"Roboto\\", \\"Helvetica\\", \\"Arial\\", sans-serif",
+                                                                              "fontSize": 14,
+                                                                              "fontWeightBold": 700,
+                                                                              "fontWeightLight": 300,
+                                                                              "fontWeightMedium": 500,
+                                                                              "fontWeightRegular": 400,
+                                                                              "h1": Object {
+                                                                                "fontFamily": "\\"Roboto\\", \\"Helvetica\\", \\"Arial\\", sans-serif",
+                                                                                "fontSize": "6rem",
+                                                                                "fontWeight": 300,
+                                                                                "letterSpacing": "-0.01562em",
+                                                                                "lineHeight": 1,
+                                                                              },
+                                                                              "h2": Object {
+                                                                                "fontFamily": "\\"Roboto\\", \\"Helvetica\\", \\"Arial\\", sans-serif",
+                                                                                "fontSize": "3.75rem",
+                                                                                "fontWeight": 300,
+                                                                                "letterSpacing": "-0.00833em",
+                                                                                "lineHeight": 1,
+                                                                              },
+                                                                              "h3": Object {
+                                                                                "fontFamily": "\\"Roboto\\", \\"Helvetica\\", \\"Arial\\", sans-serif",
+                                                                                "fontSize": "3rem",
+                                                                                "fontWeight": 400,
+                                                                                "letterSpacing": "0em",
+                                                                                "lineHeight": 1.04,
+                                                                              },
+                                                                              "h4": Object {
+                                                                                "fontFamily": "\\"Roboto\\", \\"Helvetica\\", \\"Arial\\", sans-serif",
+                                                                                "fontSize": "2.125rem",
+                                                                                "fontWeight": 400,
+                                                                                "letterSpacing": "0.00735em",
+                                                                                "lineHeight": 1.17,
+                                                                              },
+                                                                              "h5": Object {
+                                                                                "fontFamily": "\\"Roboto\\", \\"Helvetica\\", \\"Arial\\", sans-serif",
+                                                                                "fontSize": "1.5rem",
+                                                                                "fontWeight": 400,
+                                                                                "letterSpacing": "0em",
+                                                                                "lineHeight": 1.33,
+                                                                              },
+                                                                              "h6": Object {
+                                                                                "fontFamily": "\\"Roboto\\", \\"Helvetica\\", \\"Arial\\", sans-serif",
+                                                                                "fontSize": "1.25rem",
+                                                                                "fontWeight": 500,
+                                                                                "letterSpacing": "0.0075em",
+                                                                                "lineHeight": 1.6,
+                                                                              },
+                                                                              "htmlFontSize": 16,
+                                                                              "overline": Object {
+                                                                                "fontFamily": "\\"Roboto\\", \\"Helvetica\\", \\"Arial\\", sans-serif",
+                                                                                "fontSize": "0.75rem",
+                                                                                "fontWeight": 400,
+                                                                                "letterSpacing": "0.08333em",
+                                                                                "lineHeight": 2.66,
+                                                                                "textTransform": "uppercase",
+                                                                              },
+                                                                              "pxToRem": [Function],
+                                                                              "round": [Function],
+                                                                              "subtitle1": Object {
+                                                                                "fontFamily": "\\"Roboto\\", \\"Helvetica\\", \\"Arial\\", sans-serif",
+                                                                                "fontSize": "1rem",
+                                                                                "fontWeight": 400,
+                                                                                "letterSpacing": "0.00938em",
+                                                                                "lineHeight": 1.75,
+                                                                              },
+                                                                              "subtitle2": Object {
+                                                                                "fontFamily": "\\"Roboto\\", \\"Helvetica\\", \\"Arial\\", sans-serif",
+                                                                                "fontSize": "0.875rem",
+                                                                                "fontWeight": 500,
+                                                                                "letterSpacing": "0.00714em",
+                                                                                "lineHeight": 1.57,
+                                                                              },
+                                                                            },
+                                                                            "zIndex": Object {
+                                                                              "appBar": 1100,
+                                                                              "drawer": 1200,
+                                                                              "mobileStepper": 1000,
+                                                                              "modal": 1300,
+                                                                              "snackbar": 1400,
+                                                                              "tooltip": 1500,
+                                                                            },
+                                                                          }
+                                                                        }
+                                                                        variant="body1"
+                                                                      >
+                                                                        <span
+                                                                          className="MuiTypography-root MuiListItemText-primary MuiTypography-body1"
+                                                                        >
+                                                                          New portfolio
+                                                                        </span>
+                                                                      </ForwardRef(Typography)>
+                                                                    </WithStyles(ForwardRef(Typography))>
+                                                                  </div>
+                                                                </ForwardRef(ListItemText)>
+                                                              </WithStyles(ForwardRef(ListItemText))>
+                                                              <NoSsr>
+                                                                <WithStyles(TouchRipple)
+                                                                  center={false}
+                                                                >
+                                                                  <TouchRipple
+                                                                    center={false}
+                                                                    classes={
+                                                                      Object {
+                                                                        "child": "MuiTouchRipple-child",
+                                                                        "childLeaving": "MuiTouchRipple-childLeaving",
+                                                                        "childPulsate": "MuiTouchRipple-childPulsate",
+                                                                        "ripple": "MuiTouchRipple-ripple",
+                                                                        "ripplePulsate": "MuiTouchRipple-ripplePulsate",
+                                                                        "rippleVisible": "MuiTouchRipple-rippleVisible",
+                                                                        "root": "MuiTouchRipple-root",
+                                                                      }
+                                                                    }
+                                                                  >
+                                                                    <span
+                                                                      className="MuiTouchRipple-root"
+                                                                    >
+                                                                      <TransitionGroup
+                                                                        childFactory={[Function]}
+                                                                        component={null}
+                                                                        enter={true}
+                                                                        exit={true}
+                                                                      />
+                                                                    </span>
+                                                                  </TouchRipple>
+                                                                </WithStyles(TouchRipple)>
+                                                              </NoSsr>
+                                                            </div>
+                                                          </ForwardRef(ButtonBase)>
+                                                        </WithStyles(ForwardRef(ButtonBase))>
+                                                      </ForwardRef(ListItem)>
+                                                    </WithStyles(ForwardRef(ListItem))>
+                                                  </MenuItem>
+                                                </WithStyles(MenuItem)>
+                                                <WithStyles(ForwardRef(Divider))
+                                                  key="menu-88.82643"
+                                                >
+                                                  <ForwardRef(Divider)
+                                                    classes={
+                                                      Object {
+                                                        "absolute": "MuiDivider-absolute",
+                                                        "inset": "MuiDivider-inset",
+                                                        "light": "MuiDivider-light",
+                                                        "middle": "MuiDivider-middle",
+                                                        "root": "MuiDivider-root",
+                                                      }
+                                                    }
+                                                  >
+                                                    <hr
+                                                      className="MuiDivider-root"
+                                                    />
+                                                  </ForwardRef(Divider)>
+                                                </WithStyles(ForwardRef(Divider))>
+                                                <WithStyles(MenuItem)
+                                                  icon={
+                                                    Object {
+                                                      "$$typeof": Symbol(react.memo),
+                                                      "compare": null,
+                                                      "displayName": "BugReportIcon",
+                                                      "muiName": "SvgIcon",
+                                                      "type": Object {
+                                                        "$$typeof": Symbol(react.forward_ref),
+                                                        "render": [Function],
+                                                      },
+                                                    }
+                                                  }
+                                                  key="menu-34.37066"
+                                                  redirectTo={[Function]}
+                                                  title="Report a bug"
+                                                  url="/bug"
+                                                >
+                                                  <MenuItem
+                                                    classes={
+                                                      Object {
+                                                        "isDisabled": "MenuItem-isDisabled-128",
+                                                      }
+                                                    }
+                                                    icon={
+                                                      Object {
+                                                        "$$typeof": Symbol(react.memo),
+                                                        "compare": null,
+                                                        "displayName": "BugReportIcon",
+                                                        "muiName": "SvgIcon",
+                                                        "type": Object {
+                                                          "$$typeof": Symbol(react.forward_ref),
+                                                          "render": [Function],
+                                                        },
+                                                      }
+                                                    }
+                                                    isDisabled={false}
+                                                    redirectTo={[Function]}
+                                                    title="Report a bug"
+                                                    url="/bug"
+                                                  >
+                                                    <WithStyles(ForwardRef(ListItem))
+                                                      button={true}
+                                                      className=""
+                                                      onClick={[Function]}
+                                                    >
+                                                      <ForwardRef(ListItem)
+                                                        button={true}
+                                                        className=""
+                                                        classes={
+                                                          Object {
+                                                            "alignItemsFlexStart": "MuiListItem-alignItemsFlexStart",
+                                                            "button": "MuiListItem-button",
+                                                            "container": "MuiListItem-container",
+                                                            "dense": "MuiListItem-dense",
+                                                            "disabled": "Mui-disabled",
+                                                            "divider": "MuiListItem-divider",
+                                                            "focusVisible": "Mui-focusVisible",
+                                                            "gutters": "MuiListItem-gutters",
+                                                            "root": "MuiListItem-root",
+                                                            "secondaryAction": "MuiListItem-secondaryAction",
+                                                            "selected": "Mui-selected",
+                                                          }
+                                                        }
+                                                        onClick={[Function]}
+                                                      >
+                                                        <WithStyles(ForwardRef(ButtonBase))
+                                                          className="MuiListItem-root MuiListItem-gutters MuiListItem-button"
+                                                          component="div"
+                                                          disabled={false}
+                                                          focusVisibleClassName="Mui-focusVisible"
+                                                          onClick={[Function]}
+                                                        >
+                                                          <ForwardRef(ButtonBase)
+                                                            className="MuiListItem-root MuiListItem-gutters MuiListItem-button"
+                                                            classes={
+                                                              Object {
+                                                                "disabled": "Mui-disabled",
+                                                                "focusVisible": "Mui-focusVisible",
+                                                                "root": "MuiButtonBase-root",
+                                                              }
+                                                            }
+                                                            component="div"
+                                                            disabled={false}
+                                                            focusVisibleClassName="Mui-focusVisible"
+                                                            onClick={[Function]}
+                                                          >
+                                                            <div
+                                                              aria-disabled={false}
+                                                              className="MuiButtonBase-root MuiListItem-root MuiListItem-gutters MuiListItem-button"
+                                                              onBlur={[Function]}
+                                                              onClick={[Function]}
+                                                              onFocus={[Function]}
+                                                              onKeyDown={[Function]}
+                                                              onKeyUp={[Function]}
+                                                              onMouseDown={[Function]}
+                                                              onMouseLeave={[Function]}
+                                                              onMouseUp={[Function]}
+                                                              onTouchEnd={[Function]}
+                                                              onTouchMove={[Function]}
+                                                              onTouchStart={[Function]}
+                                                              role="button"
+                                                              tabIndex={0}
+                                                            >
+                                                              <WithStyles(ForwardRef(ListItemIcon))
+                                                                key=".0"
+                                                              >
+                                                                <ForwardRef(ListItemIcon)
+                                                                  classes={
+                                                                    Object {
+                                                                      "root": "MuiListItemIcon-root",
+                                                                    }
+                                                                  }
+                                                                >
+                                                                  <div
+                                                                    className="MuiListItemIcon-root"
+                                                                  >
+                                                                    <ForwardRef>
+                                                                      <WithStyles(ForwardRef(SvgIcon))>
+                                                                        <ForwardRef(SvgIcon)
+                                                                          classes={
+                                                                            Object {
+                                                                              "colorAction": "MuiSvgIcon-colorAction",
+                                                                              "colorDisabled": "MuiSvgIcon-colorDisabled",
+                                                                              "colorError": "MuiSvgIcon-colorError",
+                                                                              "colorPrimary": "MuiSvgIcon-colorPrimary",
+                                                                              "colorSecondary": "MuiSvgIcon-colorSecondary",
+                                                                              "fontSizeInherit": "MuiSvgIcon-fontSizeInherit",
+                                                                              "fontSizeLarge": "MuiSvgIcon-fontSizeLarge",
+                                                                              "fontSizeSmall": "MuiSvgIcon-fontSizeSmall",
+                                                                              "root": "MuiSvgIcon-root",
+                                                                            }
+                                                                          }
+                                                                        >
+                                                                          <svg
+                                                                            aria-hidden="true"
+                                                                            className="MuiSvgIcon-root"
+                                                                            focusable="false"
+                                                                            role="presentation"
+                                                                            viewBox="0 0 24 24"
+                                                                          >
+                                                                            <path
+                                                                              d="M0 0h24v24H0z"
+                                                                              fill="none"
+                                                                            />
+                                                                            <path
+                                                                              d="M20 8h-2.81c-.45-.78-1.07-1.45-1.82-1.96L17 4.41 15.59 3l-2.17 2.17C12.96 5.06 12.49 5 12 5c-.49 0-.96.06-1.41.17L8.41 3 7 4.41l1.62 1.63C7.88 6.55 7.26 7.22 6.81 8H4v2h2.09c-.05.33-.09.66-.09 1v1H4v2h2v1c0 .34.04.67.09 1H4v2h2.81c1.04 1.79 2.97 3 5.19 3s4.15-1.21 5.19-3H20v-2h-2.09c.05-.33.09-.66.09-1v-1h2v-2h-2v-1c0-.34-.04-.67-.09-1H20V8zm-6 8h-4v-2h4v2zm0-4h-4v-2h4v2z"
+                                                                            />
+                                                                          </svg>
+                                                                        </ForwardRef(SvgIcon)>
+                                                                      </WithStyles(ForwardRef(SvgIcon))>
+                                                                    </ForwardRef>
+                                                                  </div>
+                                                                </ForwardRef(ListItemIcon)>
+                                                              </WithStyles(ForwardRef(ListItemIcon))>
+                                                              <WithStyles(ForwardRef(ListItemText))
+                                                                key=".1"
+                                                                primary="Report a bug"
+                                                              >
+                                                                <ForwardRef(ListItemText)
+                                                                  classes={
+                                                                    Object {
+                                                                      "dense": "MuiListItemText-dense",
+                                                                      "inset": "MuiListItemText-inset",
+                                                                      "multiline": "MuiListItemText-multiline",
+                                                                      "primary": "MuiListItemText-primary",
+                                                                      "root": "MuiListItemText-root",
+                                                                      "secondary": "MuiListItemText-secondary",
+                                                                    }
+                                                                  }
+                                                                  primary="Report a bug"
+                                                                >
+                                                                  <div
+                                                                    className="MuiListItemText-root"
+                                                                  >
+                                                                    <WithStyles(ForwardRef(Typography))
+                                                                      className="MuiListItemText-primary"
+                                                                      component="span"
+                                                                      variant="body1"
+                                                                    >
+                                                                      <ForwardRef(Typography)
+                                                                        className="MuiListItemText-primary"
+                                                                        classes={
+                                                                          Object {
+                                                                            "alignCenter": "MuiTypography-alignCenter",
+                                                                            "alignJustify": "MuiTypography-alignJustify",
+                                                                            "alignLeft": "MuiTypography-alignLeft",
+                                                                            "alignRight": "MuiTypography-alignRight",
+                                                                            "body1": "MuiTypography-body1",
+                                                                            "body2": "MuiTypography-body2",
+                                                                            "button": "MuiTypography-button",
+                                                                            "caption": "MuiTypography-caption",
+                                                                            "colorError": "MuiTypography-colorError",
+                                                                            "colorInherit": "MuiTypography-colorInherit",
+                                                                            "colorPrimary": "MuiTypography-colorPrimary",
+                                                                            "colorSecondary": "MuiTypography-colorSecondary",
+                                                                            "colorTextPrimary": "MuiTypography-colorTextPrimary",
+                                                                            "colorTextSecondary": "MuiTypography-colorTextSecondary",
+                                                                            "displayBlock": "MuiTypography-displayBlock",
+                                                                            "displayInline": "MuiTypography-displayInline",
+                                                                            "gutterBottom": "MuiTypography-gutterBottom",
+                                                                            "h1": "MuiTypography-h1",
+                                                                            "h2": "MuiTypography-h2",
+                                                                            "h3": "MuiTypography-h3",
+                                                                            "h4": "MuiTypography-h4",
+                                                                            "h5": "MuiTypography-h5",
+                                                                            "h6": "MuiTypography-h6",
+                                                                            "noWrap": "MuiTypography-noWrap",
+                                                                            "overline": "MuiTypography-overline",
+                                                                            "paragraph": "MuiTypography-paragraph",
+                                                                            "root": "MuiTypography-root",
+                                                                            "srOnly": "MuiTypography-srOnly",
+                                                                            "subtitle1": "MuiTypography-subtitle1",
+                                                                            "subtitle2": "MuiTypography-subtitle2",
+                                                                          }
+                                                                        }
+                                                                        component="span"
+                                                                        theme={
+                                                                          Object {
+                                                                            "breakpoints": Object {
+                                                                              "between": [Function],
+                                                                              "down": [Function],
+                                                                              "keys": Array [
+                                                                                "xs",
+                                                                                "sm",
+                                                                                "md",
+                                                                                "lg",
+                                                                                "xl",
+                                                                              ],
+                                                                              "only": [Function],
+                                                                              "up": [Function],
+                                                                              "values": Object {
+                                                                                "lg": 1280,
+                                                                                "md": 960,
+                                                                                "sm": 600,
+                                                                                "xl": 1920,
+                                                                                "xs": 0,
+                                                                              },
+                                                                              "width": [Function],
+                                                                            },
+                                                                            "direction": "ltr",
+                                                                            "mixins": Object {
+                                                                              "gutters": [Function],
+                                                                              "toolbar": Object {
+                                                                                "@media (min-width:0px) and (orientation: landscape)": Object {
+                                                                                  "minHeight": 48,
+                                                                                },
+                                                                                "@media (min-width:600px)": Object {
+                                                                                  "minHeight": 64,
+                                                                                },
+                                                                                "minHeight": 56,
+                                                                              },
+                                                                            },
+                                                                            "overrides": Object {},
+                                                                            "palette": Object {
+                                                                              "action": Object {
+                                                                                "active": "rgba(0, 0, 0, 0.54)",
+                                                                                "disabled": "rgba(0, 0, 0, 0.26)",
+                                                                                "disabledBackground": "rgba(0, 0, 0, 0.12)",
+                                                                                "hover": "rgba(0, 0, 0, 0.08)",
+                                                                                "hoverOpacity": 0.08,
+                                                                                "selected": "rgba(0, 0, 0, 0.14)",
+                                                                              },
+                                                                              "augmentColor": [Function],
+                                                                              "background": Object {
+                                                                                "default": "#fafafa",
+                                                                                "paper": "#fff",
+                                                                              },
+                                                                              "common": Object {
+                                                                                "black": "#000",
+                                                                                "white": "#fff",
+                                                                              },
+                                                                              "contrastThreshold": 3,
+                                                                              "divider": "rgba(0, 0, 0, 0.12)",
+                                                                              "error": Object {
+                                                                                "contrastText": "#fff",
+                                                                                "dark": "#d32f2f",
+                                                                                "light": "#e57373",
+                                                                                "main": "#f44336",
+                                                                              },
+                                                                              "getContrastText": [Function],
+                                                                              "grey": Object {
+                                                                                "100": "#f5f5f5",
+                                                                                "200": "#eeeeee",
+                                                                                "300": "#e0e0e0",
+                                                                                "400": "#bdbdbd",
+                                                                                "50": "#fafafa",
+                                                                                "500": "#9e9e9e",
+                                                                                "600": "#757575",
+                                                                                "700": "#616161",
+                                                                                "800": "#424242",
+                                                                                "900": "#212121",
+                                                                                "A100": "#d5d5d5",
+                                                                                "A200": "#aaaaaa",
+                                                                                "A400": "#303030",
+                                                                                "A700": "#616161",
+                                                                              },
+                                                                              "primary": Object {
+                                                                                "contrastText": "#fff",
+                                                                                "dark": "#303f9f",
+                                                                                "light": "#7986cb",
+                                                                                "main": "#3f51b5",
+                                                                              },
+                                                                              "secondary": Object {
+                                                                                "contrastText": "#fff",
+                                                                                "dark": "#c51162",
+                                                                                "light": "#ff4081",
+                                                                                "main": "#f50057",
+                                                                              },
+                                                                              "text": Object {
+                                                                                "disabled": "rgba(0, 0, 0, 0.38)",
+                                                                                "hint": "rgba(0, 0, 0, 0.38)",
+                                                                                "primary": "rgba(0, 0, 0, 0.87)",
+                                                                                "secondary": "rgba(0, 0, 0, 0.54)",
+                                                                              },
+                                                                              "tonalOffset": 0.2,
+                                                                              "type": "light",
+                                                                            },
+                                                                            "props": Object {},
+                                                                            "shadows": Array [
+                                                                              "none",
+                                                                              "0px 1px 3px 0px rgba(0,0,0,0.2),0px 1px 1px 0px rgba(0,0,0,0.14),0px 2px 1px -1px rgba(0,0,0,0.12)",
+                                                                              "0px 1px 5px 0px rgba(0,0,0,0.2),0px 2px 2px 0px rgba(0,0,0,0.14),0px 3px 1px -2px rgba(0,0,0,0.12)",
+                                                                              "0px 1px 8px 0px rgba(0,0,0,0.2),0px 3px 4px 0px rgba(0,0,0,0.14),0px 3px 3px -2px rgba(0,0,0,0.12)",
+                                                                              "0px 2px 4px -1px rgba(0,0,0,0.2),0px 4px 5px 0px rgba(0,0,0,0.14),0px 1px 10px 0px rgba(0,0,0,0.12)",
+                                                                              "0px 3px 5px -1px rgba(0,0,0,0.2),0px 5px 8px 0px rgba(0,0,0,0.14),0px 1px 14px 0px rgba(0,0,0,0.12)",
+                                                                              "0px 3px 5px -1px rgba(0,0,0,0.2),0px 6px 10px 0px rgba(0,0,0,0.14),0px 1px 18px 0px rgba(0,0,0,0.12)",
+                                                                              "0px 4px 5px -2px rgba(0,0,0,0.2),0px 7px 10px 1px rgba(0,0,0,0.14),0px 2px 16px 1px rgba(0,0,0,0.12)",
+                                                                              "0px 5px 5px -3px rgba(0,0,0,0.2),0px 8px 10px 1px rgba(0,0,0,0.14),0px 3px 14px 2px rgba(0,0,0,0.12)",
+                                                                              "0px 5px 6px -3px rgba(0,0,0,0.2),0px 9px 12px 1px rgba(0,0,0,0.14),0px 3px 16px 2px rgba(0,0,0,0.12)",
+                                                                              "0px 6px 6px -3px rgba(0,0,0,0.2),0px 10px 14px 1px rgba(0,0,0,0.14),0px 4px 18px 3px rgba(0,0,0,0.12)",
+                                                                              "0px 6px 7px -4px rgba(0,0,0,0.2),0px 11px 15px 1px rgba(0,0,0,0.14),0px 4px 20px 3px rgba(0,0,0,0.12)",
+                                                                              "0px 7px 8px -4px rgba(0,0,0,0.2),0px 12px 17px 2px rgba(0,0,0,0.14),0px 5px 22px 4px rgba(0,0,0,0.12)",
+                                                                              "0px 7px 8px -4px rgba(0,0,0,0.2),0px 13px 19px 2px rgba(0,0,0,0.14),0px 5px 24px 4px rgba(0,0,0,0.12)",
+                                                                              "0px 7px 9px -4px rgba(0,0,0,0.2),0px 14px 21px 2px rgba(0,0,0,0.14),0px 5px 26px 4px rgba(0,0,0,0.12)",
+                                                                              "0px 8px 9px -5px rgba(0,0,0,0.2),0px 15px 22px 2px rgba(0,0,0,0.14),0px 6px 28px 5px rgba(0,0,0,0.12)",
+                                                                              "0px 8px 10px -5px rgba(0,0,0,0.2),0px 16px 24px 2px rgba(0,0,0,0.14),0px 6px 30px 5px rgba(0,0,0,0.12)",
+                                                                              "0px 8px 11px -5px rgba(0,0,0,0.2),0px 17px 26px 2px rgba(0,0,0,0.14),0px 6px 32px 5px rgba(0,0,0,0.12)",
+                                                                              "0px 9px 11px -5px rgba(0,0,0,0.2),0px 18px 28px 2px rgba(0,0,0,0.14),0px 7px 34px 6px rgba(0,0,0,0.12)",
+                                                                              "0px 9px 12px -6px rgba(0,0,0,0.2),0px 19px 29px 2px rgba(0,0,0,0.14),0px 7px 36px 6px rgba(0,0,0,0.12)",
+                                                                              "0px 10px 13px -6px rgba(0,0,0,0.2),0px 20px 31px 3px rgba(0,0,0,0.14),0px 8px 38px 7px rgba(0,0,0,0.12)",
+                                                                              "0px 10px 13px -6px rgba(0,0,0,0.2),0px 21px 33px 3px rgba(0,0,0,0.14),0px 8px 40px 7px rgba(0,0,0,0.12)",
+                                                                              "0px 10px 14px -6px rgba(0,0,0,0.2),0px 22px 35px 3px rgba(0,0,0,0.14),0px 8px 42px 7px rgba(0,0,0,0.12)",
+                                                                              "0px 11px 14px -7px rgba(0,0,0,0.2),0px 23px 36px 3px rgba(0,0,0,0.14),0px 9px 44px 8px rgba(0,0,0,0.12)",
+                                                                              "0px 11px 15px -7px rgba(0,0,0,0.2),0px 24px 38px 3px rgba(0,0,0,0.14),0px 9px 46px 8px rgba(0,0,0,0.12)",
+                                                                            ],
+                                                                            "shape": Object {
+                                                                              "borderRadius": 4,
+                                                                            },
+                                                                            "spacing": [Function],
+                                                                            "transitions": Object {
+                                                                              "create": [Function],
+                                                                              "duration": Object {
+                                                                                "complex": 375,
+                                                                                "enteringScreen": 225,
+                                                                                "leavingScreen": 195,
+                                                                                "short": 250,
+                                                                                "shorter": 200,
+                                                                                "shortest": 150,
+                                                                                "standard": 300,
+                                                                              },
+                                                                              "easing": Object {
+                                                                                "easeIn": "cubic-bezier(0.4, 0, 1, 1)",
+                                                                                "easeInOut": "cubic-bezier(0.4, 0, 0.2, 1)",
+                                                                                "easeOut": "cubic-bezier(0.0, 0, 0.2, 1)",
+                                                                                "sharp": "cubic-bezier(0.4, 0, 0.6, 1)",
+                                                                              },
+                                                                              "getAutoHeightDuration": [Function],
+                                                                            },
+                                                                            "typography": Object {
+                                                                              "body1": Object {
+                                                                                "fontFamily": "\\"Roboto\\", \\"Helvetica\\", \\"Arial\\", sans-serif",
+                                                                                "fontSize": "1rem",
+                                                                                "fontWeight": 400,
+                                                                                "letterSpacing": "0.00938em",
+                                                                                "lineHeight": 1.5,
+                                                                              },
+                                                                              "body2": Object {
+                                                                                "fontFamily": "\\"Roboto\\", \\"Helvetica\\", \\"Arial\\", sans-serif",
+                                                                                "fontSize": "0.875rem",
+                                                                                "fontWeight": 400,
+                                                                                "letterSpacing": "0.01071em",
+                                                                                "lineHeight": 1.43,
+                                                                              },
+                                                                              "button": Object {
+                                                                                "fontFamily": "\\"Roboto\\", \\"Helvetica\\", \\"Arial\\", sans-serif",
+                                                                                "fontSize": "0.875rem",
+                                                                                "fontWeight": 500,
+                                                                                "letterSpacing": "0.02857em",
+                                                                                "lineHeight": 1.75,
+                                                                                "textTransform": "uppercase",
+                                                                              },
+                                                                              "caption": Object {
+                                                                                "fontFamily": "\\"Roboto\\", \\"Helvetica\\", \\"Arial\\", sans-serif",
+                                                                                "fontSize": "0.75rem",
+                                                                                "fontWeight": 400,
+                                                                                "letterSpacing": "0.03333em",
+                                                                                "lineHeight": 1.66,
+                                                                              },
+                                                                              "fontFamily": "\\"Roboto\\", \\"Helvetica\\", \\"Arial\\", sans-serif",
+                                                                              "fontSize": 14,
+                                                                              "fontWeightBold": 700,
+                                                                              "fontWeightLight": 300,
+                                                                              "fontWeightMedium": 500,
+                                                                              "fontWeightRegular": 400,
+                                                                              "h1": Object {
+                                                                                "fontFamily": "\\"Roboto\\", \\"Helvetica\\", \\"Arial\\", sans-serif",
+                                                                                "fontSize": "6rem",
+                                                                                "fontWeight": 300,
+                                                                                "letterSpacing": "-0.01562em",
+                                                                                "lineHeight": 1,
+                                                                              },
+                                                                              "h2": Object {
+                                                                                "fontFamily": "\\"Roboto\\", \\"Helvetica\\", \\"Arial\\", sans-serif",
+                                                                                "fontSize": "3.75rem",
+                                                                                "fontWeight": 300,
+                                                                                "letterSpacing": "-0.00833em",
+                                                                                "lineHeight": 1,
+                                                                              },
+                                                                              "h3": Object {
+                                                                                "fontFamily": "\\"Roboto\\", \\"Helvetica\\", \\"Arial\\", sans-serif",
+                                                                                "fontSize": "3rem",
+                                                                                "fontWeight": 400,
+                                                                                "letterSpacing": "0em",
+                                                                                "lineHeight": 1.04,
+                                                                              },
+                                                                              "h4": Object {
+                                                                                "fontFamily": "\\"Roboto\\", \\"Helvetica\\", \\"Arial\\", sans-serif",
+                                                                                "fontSize": "2.125rem",
+                                                                                "fontWeight": 400,
+                                                                                "letterSpacing": "0.00735em",
+                                                                                "lineHeight": 1.17,
+                                                                              },
+                                                                              "h5": Object {
+                                                                                "fontFamily": "\\"Roboto\\", \\"Helvetica\\", \\"Arial\\", sans-serif",
+                                                                                "fontSize": "1.5rem",
+                                                                                "fontWeight": 400,
+                                                                                "letterSpacing": "0em",
+                                                                                "lineHeight": 1.33,
+                                                                              },
+                                                                              "h6": Object {
+                                                                                "fontFamily": "\\"Roboto\\", \\"Helvetica\\", \\"Arial\\", sans-serif",
+                                                                                "fontSize": "1.25rem",
+                                                                                "fontWeight": 500,
+                                                                                "letterSpacing": "0.0075em",
+                                                                                "lineHeight": 1.6,
+                                                                              },
+                                                                              "htmlFontSize": 16,
+                                                                              "overline": Object {
+                                                                                "fontFamily": "\\"Roboto\\", \\"Helvetica\\", \\"Arial\\", sans-serif",
+                                                                                "fontSize": "0.75rem",
+                                                                                "fontWeight": 400,
+                                                                                "letterSpacing": "0.08333em",
+                                                                                "lineHeight": 2.66,
+                                                                                "textTransform": "uppercase",
+                                                                              },
+                                                                              "pxToRem": [Function],
+                                                                              "round": [Function],
+                                                                              "subtitle1": Object {
+                                                                                "fontFamily": "\\"Roboto\\", \\"Helvetica\\", \\"Arial\\", sans-serif",
+                                                                                "fontSize": "1rem",
+                                                                                "fontWeight": 400,
+                                                                                "letterSpacing": "0.00938em",
+                                                                                "lineHeight": 1.75,
+                                                                              },
+                                                                              "subtitle2": Object {
+                                                                                "fontFamily": "\\"Roboto\\", \\"Helvetica\\", \\"Arial\\", sans-serif",
+                                                                                "fontSize": "0.875rem",
+                                                                                "fontWeight": 500,
+                                                                                "letterSpacing": "0.00714em",
+                                                                                "lineHeight": 1.57,
+                                                                              },
+                                                                            },
+                                                                            "zIndex": Object {
+                                                                              "appBar": 1100,
+                                                                              "drawer": 1200,
+                                                                              "mobileStepper": 1000,
+                                                                              "modal": 1300,
+                                                                              "snackbar": 1400,
+                                                                              "tooltip": 1500,
+                                                                            },
+                                                                          }
+                                                                        }
+                                                                        variant="body1"
+                                                                      >
+                                                                        <span
+                                                                          className="MuiTypography-root MuiListItemText-primary MuiTypography-body1"
+                                                                        >
+                                                                          Report a bug
+                                                                        </span>
+                                                                      </ForwardRef(Typography)>
+                                                                    </WithStyles(ForwardRef(Typography))>
+                                                                  </div>
+                                                                </ForwardRef(ListItemText)>
+                                                              </WithStyles(ForwardRef(ListItemText))>
+                                                              <NoSsr>
+                                                                <WithStyles(TouchRipple)
+                                                                  center={false}
+                                                                >
+                                                                  <TouchRipple
+                                                                    center={false}
+                                                                    classes={
+                                                                      Object {
+                                                                        "child": "MuiTouchRipple-child",
+                                                                        "childLeaving": "MuiTouchRipple-childLeaving",
+                                                                        "childPulsate": "MuiTouchRipple-childPulsate",
+                                                                        "ripple": "MuiTouchRipple-ripple",
+                                                                        "ripplePulsate": "MuiTouchRipple-ripplePulsate",
+                                                                        "rippleVisible": "MuiTouchRipple-rippleVisible",
+                                                                        "root": "MuiTouchRipple-root",
+                                                                      }
+                                                                    }
+                                                                  >
+                                                                    <span
+                                                                      className="MuiTouchRipple-root"
+                                                                    >
+                                                                      <TransitionGroup
+                                                                        childFactory={[Function]}
+                                                                        component={null}
+                                                                        enter={true}
+                                                                        exit={true}
+                                                                      />
+                                                                    </span>
+                                                                  </TouchRipple>
+                                                                </WithStyles(TouchRipple)>
+                                                              </NoSsr>
+                                                            </div>
+                                                          </ForwardRef(ButtonBase)>
+                                                        </WithStyles(ForwardRef(ButtonBase))>
+                                                      </ForwardRef(ListItem)>
+                                                    </WithStyles(ForwardRef(ListItem))>
+                                                  </MenuItem>
+                                                </WithStyles(MenuItem)>
+                                              </ul>
+                                            </ForwardRef(List)>
+                                          </WithStyles(ForwardRef(List))>
+                                        </div>
+                                      </Menu>
+                                    </WithStyles(Menu)>
+                                  </div>
+                                </div>
+                              </ForwardRef(Paper)>
+                            </WithStyles(ForwardRef(Paper))>
+                          </Transition>
+                        </ForwardRef(Slide)>
+                      </WithTheme(ForwardRef(Slide))>
+                    </div>
+                  </ForwardRef(Drawer)>
+                </WithStyles(ForwardRef(Drawer))>
+              </Drawer>
+            </WithStyles(Drawer)>
+            <main
+              className="BaseBranch-content-3"
+            >
+              <div
+                hasCookieInfo={true}
+                isOpen={false}
+                key=".0"
+                menuOpen={true}
+                onAccept={[Function]}
+              >
+                Foo
               </div>
-            </ul>
+            </main>
           </div>
         </div>
-      </div>
-    </div>
-    <main
-      className="BaseBranch-content-3 BaseBranch-contentShift-4"
+      </BaseBranch>
+    </WithStyles(BaseBranch)>
+  </_class>
+</MockRouter>
+`;
+
+exports[`Base click on menu icon if open changes state 1`] = `
+<MockRouter
+  createHref={[Function]}
+  location=""
+  params={Object {}}
+  path=""
+  push={[Function]}
+  replace={[Function]}
+  url=""
+>
+  <_class
+    hasCookieInfo={true}
+    hasHeader={true}
+    isHeaderFixed={true}
+    isOpen={true}
+    menuData={
+      Array [
+        Object {
+          "icon": null,
+          "title": "Dashboard",
+          "type": "link",
+          "url": "/",
+        },
+        Object {
+          "isDisabled": true,
+          "title": "New portfolio",
+          "type": "link",
+          "url": "/portfolio",
+        },
+        Object {
+          "type": "divider",
+        },
+        Object {
+          "icon": Object {
+            "$$typeof": Symbol(react.memo),
+            "compare": null,
+            "displayName": "BugReportIcon",
+            "muiName": "SvgIcon",
+            "type": Object {
+              "$$typeof": Symbol(react.forward_ref),
+              "render": [Function],
+            },
+          },
+          "title": "Report a bug",
+          "type": "link",
+          "url": "/bug",
+        },
+      ]
+    }
+    menuOpen={true}
+    rightContent={null}
+    title="Foo"
+  >
+    <WithStyles(BaseBranch)
+      cookieInfoOpen={true}
+      handleDrawerClose={[Function]}
+      handleDrawerOpen={[Function]}
+      hasCookieInfo={true}
+      hasHeader={true}
+      isHeaderFixed={true}
+      isOpen={true}
+      menuData={
+        Array [
+          Object {
+            "icon": null,
+            "title": "Dashboard",
+            "type": "link",
+            "url": "/",
+          },
+          Object {
+            "isDisabled": true,
+            "title": "New portfolio",
+            "type": "link",
+            "url": "/portfolio",
+          },
+          Object {
+            "type": "divider",
+          },
+          Object {
+            "icon": Object {
+              "$$typeof": Symbol(react.memo),
+              "compare": null,
+              "displayName": "BugReportIcon",
+              "muiName": "SvgIcon",
+              "type": Object {
+                "$$typeof": Symbol(react.forward_ref),
+                "render": [Function],
+              },
+            },
+            "title": "Report a bug",
+            "type": "link",
+            "url": "/bug",
+          },
+        ]
+      }
+      menuOpen={true}
+      onClick={[Function]}
+      onCookieInfoAccept={[Function]}
+      open={true}
+      redirectTo={[Function]}
+      rightContent={null}
+      title="Foo"
     >
-      <div
-        hasCookieInfo={true}
-        history={
+      <BaseBranch
+        classes={
           Object {
-            "createHref": [Function],
-            "path": "",
-            "push": [Function],
-            "replace": [Function],
+            "appFrame": "BaseBranch-appFrame-1",
+            "appFrameWithCookieInfo": "BaseBranch-appFrameWithCookieInfo-2",
+            "content": "BaseBranch-content-3",
+            "contentShift": "BaseBranch-contentShift-4",
           }
         }
+        cookieInfoOpen={true}
+        handleDrawerClose={[Function]}
+        handleDrawerOpen={[Function]}
+        hasCookieInfo={true}
+        hasHeader={true}
+        isHeaderFixed={true}
         isOpen={true}
-        key=".0"
-        location=""
-        match={
-          Object {
-            "params": Object {},
-            "path": "",
-            "url": "",
-          }
+        menuData={
+          Array [
+            Object {
+              "icon": null,
+              "title": "Dashboard",
+              "type": "link",
+              "url": "/",
+            },
+            Object {
+              "isDisabled": true,
+              "title": "New portfolio",
+              "type": "link",
+              "url": "/portfolio",
+            },
+            Object {
+              "type": "divider",
+            },
+            Object {
+              "icon": Object {
+                "$$typeof": Symbol(react.memo),
+                "compare": null,
+                "displayName": "BugReportIcon",
+                "muiName": "SvgIcon",
+                "type": Object {
+                  "$$typeof": Symbol(react.forward_ref),
+                  "render": [Function],
+                },
+              },
+              "title": "Report a bug",
+              "type": "link",
+              "url": "/bug",
+            },
+          ]
         }
         menuOpen={true}
-        onAccept={[Function]}
+        onClick={[Function]}
+        onCookieInfoAccept={[Function]}
+        open={true}
+        redirectTo={[Function]}
+        rightContent={null}
+        title="Foo"
       >
-        Foo
-      </div>
-    </main>
-  </div>
-</div>
+        <div>
+          <WithStyles(Header)
+            isCookieInfoOpen={true}
+            isFixed={true}
+            isOpen={true}
+            onClick={[Function]}
+            onDrawerOpen={[Function]}
+            title="Foo"
+          >
+            <Header
+              classes={
+                Object {
+                  "appBar": "Header-appBar-6",
+                  "appBarShift": "Header-appBarShift-8",
+                  "appBarWithCookieInfo": "Header-appBarWithCookieInfo-7",
+                  "flex": "Header-flex-11",
+                  "hide": "Header-hide-10",
+                  "menuButton": "Header-menuButton-9",
+                  "root": "Header-root-5",
+                  "title": "Header-title-12",
+                }
+              }
+              isCookieInfoOpen={true}
+              isFixed={true}
+              isOpen={true}
+              onClick={[Function]}
+              onDrawerOpen={[Function]}
+              title="Foo"
+            >
+              <div
+                className="Header-root-5"
+              >
+                <WithStyles(ForwardRef(AppBar))
+                  className="Header-appBar-6 Header-appBarShift-8 Header-appBarWithCookieInfo-7"
+                  position="fixed"
+                >
+                  <ForwardRef(AppBar)
+                    className="Header-appBar-6 Header-appBarShift-8 Header-appBarWithCookieInfo-7"
+                    classes={
+                      Object {
+                        "colorDefault": "MuiAppBar-colorDefault",
+                        "colorPrimary": "MuiAppBar-colorPrimary",
+                        "colorSecondary": "MuiAppBar-colorSecondary",
+                        "positionAbsolute": "MuiAppBar-positionAbsolute",
+                        "positionFixed": "MuiAppBar-positionFixed",
+                        "positionRelative": "MuiAppBar-positionRelative",
+                        "positionStatic": "MuiAppBar-positionStatic",
+                        "positionSticky": "MuiAppBar-positionSticky",
+                        "root": "MuiAppBar-root",
+                      }
+                    }
+                    position="fixed"
+                  >
+                    <WithStyles(ForwardRef(Paper))
+                      className="MuiAppBar-root MuiAppBar-positionFixed Header-appBar-6 Header-appBarShift-8 Header-appBarWithCookieInfo-7 MuiAppBar-colorPrimary mui-fixed"
+                      component="header"
+                      elevation={4}
+                      square={true}
+                    >
+                      <ForwardRef(Paper)
+                        className="MuiAppBar-root MuiAppBar-positionFixed Header-appBar-6 Header-appBarShift-8 Header-appBarWithCookieInfo-7 MuiAppBar-colorPrimary mui-fixed"
+                        classes={
+                          Object {
+                            "elevation0": "MuiPaper-elevation0",
+                            "elevation1": "MuiPaper-elevation1",
+                            "elevation10": "MuiPaper-elevation10",
+                            "elevation11": "MuiPaper-elevation11",
+                            "elevation12": "MuiPaper-elevation12",
+                            "elevation13": "MuiPaper-elevation13",
+                            "elevation14": "MuiPaper-elevation14",
+                            "elevation15": "MuiPaper-elevation15",
+                            "elevation16": "MuiPaper-elevation16",
+                            "elevation17": "MuiPaper-elevation17",
+                            "elevation18": "MuiPaper-elevation18",
+                            "elevation19": "MuiPaper-elevation19",
+                            "elevation2": "MuiPaper-elevation2",
+                            "elevation20": "MuiPaper-elevation20",
+                            "elevation21": "MuiPaper-elevation21",
+                            "elevation22": "MuiPaper-elevation22",
+                            "elevation23": "MuiPaper-elevation23",
+                            "elevation24": "MuiPaper-elevation24",
+                            "elevation3": "MuiPaper-elevation3",
+                            "elevation4": "MuiPaper-elevation4",
+                            "elevation5": "MuiPaper-elevation5",
+                            "elevation6": "MuiPaper-elevation6",
+                            "elevation7": "MuiPaper-elevation7",
+                            "elevation8": "MuiPaper-elevation8",
+                            "elevation9": "MuiPaper-elevation9",
+                            "root": "MuiPaper-root",
+                            "rounded": "MuiPaper-rounded",
+                          }
+                        }
+                        component="header"
+                        elevation={4}
+                        square={true}
+                      >
+                        <header
+                          className="MuiPaper-root MuiPaper-elevation4 MuiAppBar-root MuiAppBar-positionFixed Header-appBar-6 Header-appBarShift-8 Header-appBarWithCookieInfo-7 MuiAppBar-colorPrimary mui-fixed"
+                        >
+                          <WithStyles(ForwardRef(Toolbar))>
+                            <ForwardRef(Toolbar)
+                              classes={
+                                Object {
+                                  "dense": "MuiToolbar-dense",
+                                  "gutters": "MuiToolbar-gutters",
+                                  "regular": "MuiToolbar-regular",
+                                  "root": "MuiToolbar-root",
+                                }
+                              }
+                            >
+                              <div
+                                className="MuiToolbar-root MuiToolbar-regular MuiToolbar-gutters"
+                              >
+                                <WithStyles(ForwardRef(IconButton))
+                                  aria-label="open drawer"
+                                  className="Header-menuButton-9 Header-hide-10"
+                                  color="inherit"
+                                  onClick={[Function]}
+                                >
+                                  <ForwardRef(IconButton)
+                                    aria-label="open drawer"
+                                    className="Header-menuButton-9 Header-hide-10"
+                                    classes={
+                                      Object {
+                                        "colorInherit": "MuiIconButton-colorInherit",
+                                        "colorPrimary": "MuiIconButton-colorPrimary",
+                                        "colorSecondary": "MuiIconButton-colorSecondary",
+                                        "disabled": "Mui-disabled",
+                                        "edgeEnd": "MuiIconButton-edgeEnd",
+                                        "edgeStart": "MuiIconButton-edgeStart",
+                                        "label": "MuiIconButton-label",
+                                        "root": "MuiIconButton-root",
+                                        "sizeSmall": "MuiIconButton-sizeSmall",
+                                      }
+                                    }
+                                    color="inherit"
+                                    onClick={[Function]}
+                                  >
+                                    <WithStyles(ForwardRef(ButtonBase))
+                                      aria-label="open drawer"
+                                      centerRipple={true}
+                                      className="MuiIconButton-root Header-menuButton-9 Header-hide-10 MuiIconButton-colorInherit"
+                                      disabled={false}
+                                      focusRipple={true}
+                                      onClick={[Function]}
+                                    >
+                                      <ForwardRef(ButtonBase)
+                                        aria-label="open drawer"
+                                        centerRipple={true}
+                                        className="MuiIconButton-root Header-menuButton-9 Header-hide-10 MuiIconButton-colorInherit"
+                                        classes={
+                                          Object {
+                                            "disabled": "Mui-disabled",
+                                            "focusVisible": "Mui-focusVisible",
+                                            "root": "MuiButtonBase-root",
+                                          }
+                                        }
+                                        disabled={false}
+                                        focusRipple={true}
+                                        onClick={[Function]}
+                                      >
+                                        <button
+                                          aria-label="open drawer"
+                                          className="MuiButtonBase-root MuiIconButton-root Header-menuButton-9 Header-hide-10 MuiIconButton-colorInherit"
+                                          disabled={false}
+                                          onBlur={[Function]}
+                                          onClick={[Function]}
+                                          onFocus={[Function]}
+                                          onKeyDown={[Function]}
+                                          onKeyUp={[Function]}
+                                          onMouseDown={[Function]}
+                                          onMouseLeave={[Function]}
+                                          onMouseUp={[Function]}
+                                          onTouchEnd={[Function]}
+                                          onTouchMove={[Function]}
+                                          onTouchStart={[Function]}
+                                          tabIndex={0}
+                                          type="button"
+                                        >
+                                          <span
+                                            className="MuiIconButton-label"
+                                          >
+                                            <ForwardRef>
+                                              <WithStyles(ForwardRef(SvgIcon))>
+                                                <ForwardRef(SvgIcon)
+                                                  classes={
+                                                    Object {
+                                                      "colorAction": "MuiSvgIcon-colorAction",
+                                                      "colorDisabled": "MuiSvgIcon-colorDisabled",
+                                                      "colorError": "MuiSvgIcon-colorError",
+                                                      "colorPrimary": "MuiSvgIcon-colorPrimary",
+                                                      "colorSecondary": "MuiSvgIcon-colorSecondary",
+                                                      "fontSizeInherit": "MuiSvgIcon-fontSizeInherit",
+                                                      "fontSizeLarge": "MuiSvgIcon-fontSizeLarge",
+                                                      "fontSizeSmall": "MuiSvgIcon-fontSizeSmall",
+                                                      "root": "MuiSvgIcon-root",
+                                                    }
+                                                  }
+                                                >
+                                                  <svg
+                                                    aria-hidden="true"
+                                                    className="MuiSvgIcon-root"
+                                                    focusable="false"
+                                                    role="presentation"
+                                                    viewBox="0 0 24 24"
+                                                  >
+                                                    <path
+                                                      d="M0 0h24v24H0z"
+                                                      fill="none"
+                                                    />
+                                                    <path
+                                                      d="M3 18h18v-2H3v2zm0-5h18v-2H3v2zm0-7v2h18V6H3z"
+                                                    />
+                                                  </svg>
+                                                </ForwardRef(SvgIcon)>
+                                              </WithStyles(ForwardRef(SvgIcon))>
+                                            </ForwardRef>
+                                          </span>
+                                          <NoSsr>
+                                            <WithStyles(TouchRipple)
+                                              center={true}
+                                            >
+                                              <TouchRipple
+                                                center={true}
+                                                classes={
+                                                  Object {
+                                                    "child": "MuiTouchRipple-child",
+                                                    "childLeaving": "MuiTouchRipple-childLeaving",
+                                                    "childPulsate": "MuiTouchRipple-childPulsate",
+                                                    "ripple": "MuiTouchRipple-ripple",
+                                                    "ripplePulsate": "MuiTouchRipple-ripplePulsate",
+                                                    "rippleVisible": "MuiTouchRipple-rippleVisible",
+                                                    "root": "MuiTouchRipple-root",
+                                                  }
+                                                }
+                                              >
+                                                <span
+                                                  className="MuiTouchRipple-root"
+                                                >
+                                                  <TransitionGroup
+                                                    childFactory={[Function]}
+                                                    component={null}
+                                                    enter={true}
+                                                    exit={true}
+                                                  />
+                                                </span>
+                                              </TouchRipple>
+                                            </WithStyles(TouchRipple)>
+                                          </NoSsr>
+                                        </button>
+                                      </ForwardRef(ButtonBase)>
+                                    </WithStyles(ForwardRef(ButtonBase))>
+                                  </ForwardRef(IconButton)>
+                                </WithStyles(ForwardRef(IconButton))>
+                                <WithStyles(ForwardRef(Typography))
+                                  className="Header-flex-11 Header-title-12"
+                                  color="inherit"
+                                  onClick={[Function]}
+                                  variant="h6"
+                                >
+                                  <ForwardRef(Typography)
+                                    className="Header-flex-11 Header-title-12"
+                                    classes={
+                                      Object {
+                                        "alignCenter": "MuiTypography-alignCenter",
+                                        "alignJustify": "MuiTypography-alignJustify",
+                                        "alignLeft": "MuiTypography-alignLeft",
+                                        "alignRight": "MuiTypography-alignRight",
+                                        "body1": "MuiTypography-body1",
+                                        "body2": "MuiTypography-body2",
+                                        "button": "MuiTypography-button",
+                                        "caption": "MuiTypography-caption",
+                                        "colorError": "MuiTypography-colorError",
+                                        "colorInherit": "MuiTypography-colorInherit",
+                                        "colorPrimary": "MuiTypography-colorPrimary",
+                                        "colorSecondary": "MuiTypography-colorSecondary",
+                                        "colorTextPrimary": "MuiTypography-colorTextPrimary",
+                                        "colorTextSecondary": "MuiTypography-colorTextSecondary",
+                                        "displayBlock": "MuiTypography-displayBlock",
+                                        "displayInline": "MuiTypography-displayInline",
+                                        "gutterBottom": "MuiTypography-gutterBottom",
+                                        "h1": "MuiTypography-h1",
+                                        "h2": "MuiTypography-h2",
+                                        "h3": "MuiTypography-h3",
+                                        "h4": "MuiTypography-h4",
+                                        "h5": "MuiTypography-h5",
+                                        "h6": "MuiTypography-h6",
+                                        "noWrap": "MuiTypography-noWrap",
+                                        "overline": "MuiTypography-overline",
+                                        "paragraph": "MuiTypography-paragraph",
+                                        "root": "MuiTypography-root",
+                                        "srOnly": "MuiTypography-srOnly",
+                                        "subtitle1": "MuiTypography-subtitle1",
+                                        "subtitle2": "MuiTypography-subtitle2",
+                                      }
+                                    }
+                                    color="inherit"
+                                    onClick={[Function]}
+                                    theme={
+                                      Object {
+                                        "breakpoints": Object {
+                                          "between": [Function],
+                                          "down": [Function],
+                                          "keys": Array [
+                                            "xs",
+                                            "sm",
+                                            "md",
+                                            "lg",
+                                            "xl",
+                                          ],
+                                          "only": [Function],
+                                          "up": [Function],
+                                          "values": Object {
+                                            "lg": 1280,
+                                            "md": 960,
+                                            "sm": 600,
+                                            "xl": 1920,
+                                            "xs": 0,
+                                          },
+                                          "width": [Function],
+                                        },
+                                        "direction": "ltr",
+                                        "mixins": Object {
+                                          "gutters": [Function],
+                                          "toolbar": Object {
+                                            "@media (min-width:0px) and (orientation: landscape)": Object {
+                                              "minHeight": 48,
+                                            },
+                                            "@media (min-width:600px)": Object {
+                                              "minHeight": 64,
+                                            },
+                                            "minHeight": 56,
+                                          },
+                                        },
+                                        "overrides": Object {},
+                                        "palette": Object {
+                                          "action": Object {
+                                            "active": "rgba(0, 0, 0, 0.54)",
+                                            "disabled": "rgba(0, 0, 0, 0.26)",
+                                            "disabledBackground": "rgba(0, 0, 0, 0.12)",
+                                            "hover": "rgba(0, 0, 0, 0.08)",
+                                            "hoverOpacity": 0.08,
+                                            "selected": "rgba(0, 0, 0, 0.14)",
+                                          },
+                                          "augmentColor": [Function],
+                                          "background": Object {
+                                            "default": "#fafafa",
+                                            "paper": "#fff",
+                                          },
+                                          "common": Object {
+                                            "black": "#000",
+                                            "white": "#fff",
+                                          },
+                                          "contrastThreshold": 3,
+                                          "divider": "rgba(0, 0, 0, 0.12)",
+                                          "error": Object {
+                                            "contrastText": "#fff",
+                                            "dark": "#d32f2f",
+                                            "light": "#e57373",
+                                            "main": "#f44336",
+                                          },
+                                          "getContrastText": [Function],
+                                          "grey": Object {
+                                            "100": "#f5f5f5",
+                                            "200": "#eeeeee",
+                                            "300": "#e0e0e0",
+                                            "400": "#bdbdbd",
+                                            "50": "#fafafa",
+                                            "500": "#9e9e9e",
+                                            "600": "#757575",
+                                            "700": "#616161",
+                                            "800": "#424242",
+                                            "900": "#212121",
+                                            "A100": "#d5d5d5",
+                                            "A200": "#aaaaaa",
+                                            "A400": "#303030",
+                                            "A700": "#616161",
+                                          },
+                                          "primary": Object {
+                                            "contrastText": "#fff",
+                                            "dark": "#303f9f",
+                                            "light": "#7986cb",
+                                            "main": "#3f51b5",
+                                          },
+                                          "secondary": Object {
+                                            "contrastText": "#fff",
+                                            "dark": "#c51162",
+                                            "light": "#ff4081",
+                                            "main": "#f50057",
+                                          },
+                                          "text": Object {
+                                            "disabled": "rgba(0, 0, 0, 0.38)",
+                                            "hint": "rgba(0, 0, 0, 0.38)",
+                                            "primary": "rgba(0, 0, 0, 0.87)",
+                                            "secondary": "rgba(0, 0, 0, 0.54)",
+                                          },
+                                          "tonalOffset": 0.2,
+                                          "type": "light",
+                                        },
+                                        "props": Object {},
+                                        "shadows": Array [
+                                          "none",
+                                          "0px 1px 3px 0px rgba(0,0,0,0.2),0px 1px 1px 0px rgba(0,0,0,0.14),0px 2px 1px -1px rgba(0,0,0,0.12)",
+                                          "0px 1px 5px 0px rgba(0,0,0,0.2),0px 2px 2px 0px rgba(0,0,0,0.14),0px 3px 1px -2px rgba(0,0,0,0.12)",
+                                          "0px 1px 8px 0px rgba(0,0,0,0.2),0px 3px 4px 0px rgba(0,0,0,0.14),0px 3px 3px -2px rgba(0,0,0,0.12)",
+                                          "0px 2px 4px -1px rgba(0,0,0,0.2),0px 4px 5px 0px rgba(0,0,0,0.14),0px 1px 10px 0px rgba(0,0,0,0.12)",
+                                          "0px 3px 5px -1px rgba(0,0,0,0.2),0px 5px 8px 0px rgba(0,0,0,0.14),0px 1px 14px 0px rgba(0,0,0,0.12)",
+                                          "0px 3px 5px -1px rgba(0,0,0,0.2),0px 6px 10px 0px rgba(0,0,0,0.14),0px 1px 18px 0px rgba(0,0,0,0.12)",
+                                          "0px 4px 5px -2px rgba(0,0,0,0.2),0px 7px 10px 1px rgba(0,0,0,0.14),0px 2px 16px 1px rgba(0,0,0,0.12)",
+                                          "0px 5px 5px -3px rgba(0,0,0,0.2),0px 8px 10px 1px rgba(0,0,0,0.14),0px 3px 14px 2px rgba(0,0,0,0.12)",
+                                          "0px 5px 6px -3px rgba(0,0,0,0.2),0px 9px 12px 1px rgba(0,0,0,0.14),0px 3px 16px 2px rgba(0,0,0,0.12)",
+                                          "0px 6px 6px -3px rgba(0,0,0,0.2),0px 10px 14px 1px rgba(0,0,0,0.14),0px 4px 18px 3px rgba(0,0,0,0.12)",
+                                          "0px 6px 7px -4px rgba(0,0,0,0.2),0px 11px 15px 1px rgba(0,0,0,0.14),0px 4px 20px 3px rgba(0,0,0,0.12)",
+                                          "0px 7px 8px -4px rgba(0,0,0,0.2),0px 12px 17px 2px rgba(0,0,0,0.14),0px 5px 22px 4px rgba(0,0,0,0.12)",
+                                          "0px 7px 8px -4px rgba(0,0,0,0.2),0px 13px 19px 2px rgba(0,0,0,0.14),0px 5px 24px 4px rgba(0,0,0,0.12)",
+                                          "0px 7px 9px -4px rgba(0,0,0,0.2),0px 14px 21px 2px rgba(0,0,0,0.14),0px 5px 26px 4px rgba(0,0,0,0.12)",
+                                          "0px 8px 9px -5px rgba(0,0,0,0.2),0px 15px 22px 2px rgba(0,0,0,0.14),0px 6px 28px 5px rgba(0,0,0,0.12)",
+                                          "0px 8px 10px -5px rgba(0,0,0,0.2),0px 16px 24px 2px rgba(0,0,0,0.14),0px 6px 30px 5px rgba(0,0,0,0.12)",
+                                          "0px 8px 11px -5px rgba(0,0,0,0.2),0px 17px 26px 2px rgba(0,0,0,0.14),0px 6px 32px 5px rgba(0,0,0,0.12)",
+                                          "0px 9px 11px -5px rgba(0,0,0,0.2),0px 18px 28px 2px rgba(0,0,0,0.14),0px 7px 34px 6px rgba(0,0,0,0.12)",
+                                          "0px 9px 12px -6px rgba(0,0,0,0.2),0px 19px 29px 2px rgba(0,0,0,0.14),0px 7px 36px 6px rgba(0,0,0,0.12)",
+                                          "0px 10px 13px -6px rgba(0,0,0,0.2),0px 20px 31px 3px rgba(0,0,0,0.14),0px 8px 38px 7px rgba(0,0,0,0.12)",
+                                          "0px 10px 13px -6px rgba(0,0,0,0.2),0px 21px 33px 3px rgba(0,0,0,0.14),0px 8px 40px 7px rgba(0,0,0,0.12)",
+                                          "0px 10px 14px -6px rgba(0,0,0,0.2),0px 22px 35px 3px rgba(0,0,0,0.14),0px 8px 42px 7px rgba(0,0,0,0.12)",
+                                          "0px 11px 14px -7px rgba(0,0,0,0.2),0px 23px 36px 3px rgba(0,0,0,0.14),0px 9px 44px 8px rgba(0,0,0,0.12)",
+                                          "0px 11px 15px -7px rgba(0,0,0,0.2),0px 24px 38px 3px rgba(0,0,0,0.14),0px 9px 46px 8px rgba(0,0,0,0.12)",
+                                        ],
+                                        "shape": Object {
+                                          "borderRadius": 4,
+                                        },
+                                        "spacing": [Function],
+                                        "transitions": Object {
+                                          "create": [Function],
+                                          "duration": Object {
+                                            "complex": 375,
+                                            "enteringScreen": 225,
+                                            "leavingScreen": 195,
+                                            "short": 250,
+                                            "shorter": 200,
+                                            "shortest": 150,
+                                            "standard": 300,
+                                          },
+                                          "easing": Object {
+                                            "easeIn": "cubic-bezier(0.4, 0, 1, 1)",
+                                            "easeInOut": "cubic-bezier(0.4, 0, 0.2, 1)",
+                                            "easeOut": "cubic-bezier(0.0, 0, 0.2, 1)",
+                                            "sharp": "cubic-bezier(0.4, 0, 0.6, 1)",
+                                          },
+                                          "getAutoHeightDuration": [Function],
+                                        },
+                                        "typography": Object {
+                                          "body1": Object {
+                                            "fontFamily": "\\"Roboto\\", \\"Helvetica\\", \\"Arial\\", sans-serif",
+                                            "fontSize": "1rem",
+                                            "fontWeight": 400,
+                                            "letterSpacing": "0.00938em",
+                                            "lineHeight": 1.5,
+                                          },
+                                          "body2": Object {
+                                            "fontFamily": "\\"Roboto\\", \\"Helvetica\\", \\"Arial\\", sans-serif",
+                                            "fontSize": "0.875rem",
+                                            "fontWeight": 400,
+                                            "letterSpacing": "0.01071em",
+                                            "lineHeight": 1.43,
+                                          },
+                                          "button": Object {
+                                            "fontFamily": "\\"Roboto\\", \\"Helvetica\\", \\"Arial\\", sans-serif",
+                                            "fontSize": "0.875rem",
+                                            "fontWeight": 500,
+                                            "letterSpacing": "0.02857em",
+                                            "lineHeight": 1.75,
+                                            "textTransform": "uppercase",
+                                          },
+                                          "caption": Object {
+                                            "fontFamily": "\\"Roboto\\", \\"Helvetica\\", \\"Arial\\", sans-serif",
+                                            "fontSize": "0.75rem",
+                                            "fontWeight": 400,
+                                            "letterSpacing": "0.03333em",
+                                            "lineHeight": 1.66,
+                                          },
+                                          "fontFamily": "\\"Roboto\\", \\"Helvetica\\", \\"Arial\\", sans-serif",
+                                          "fontSize": 14,
+                                          "fontWeightBold": 700,
+                                          "fontWeightLight": 300,
+                                          "fontWeightMedium": 500,
+                                          "fontWeightRegular": 400,
+                                          "h1": Object {
+                                            "fontFamily": "\\"Roboto\\", \\"Helvetica\\", \\"Arial\\", sans-serif",
+                                            "fontSize": "6rem",
+                                            "fontWeight": 300,
+                                            "letterSpacing": "-0.01562em",
+                                            "lineHeight": 1,
+                                          },
+                                          "h2": Object {
+                                            "fontFamily": "\\"Roboto\\", \\"Helvetica\\", \\"Arial\\", sans-serif",
+                                            "fontSize": "3.75rem",
+                                            "fontWeight": 300,
+                                            "letterSpacing": "-0.00833em",
+                                            "lineHeight": 1,
+                                          },
+                                          "h3": Object {
+                                            "fontFamily": "\\"Roboto\\", \\"Helvetica\\", \\"Arial\\", sans-serif",
+                                            "fontSize": "3rem",
+                                            "fontWeight": 400,
+                                            "letterSpacing": "0em",
+                                            "lineHeight": 1.04,
+                                          },
+                                          "h4": Object {
+                                            "fontFamily": "\\"Roboto\\", \\"Helvetica\\", \\"Arial\\", sans-serif",
+                                            "fontSize": "2.125rem",
+                                            "fontWeight": 400,
+                                            "letterSpacing": "0.00735em",
+                                            "lineHeight": 1.17,
+                                          },
+                                          "h5": Object {
+                                            "fontFamily": "\\"Roboto\\", \\"Helvetica\\", \\"Arial\\", sans-serif",
+                                            "fontSize": "1.5rem",
+                                            "fontWeight": 400,
+                                            "letterSpacing": "0em",
+                                            "lineHeight": 1.33,
+                                          },
+                                          "h6": Object {
+                                            "fontFamily": "\\"Roboto\\", \\"Helvetica\\", \\"Arial\\", sans-serif",
+                                            "fontSize": "1.25rem",
+                                            "fontWeight": 500,
+                                            "letterSpacing": "0.0075em",
+                                            "lineHeight": 1.6,
+                                          },
+                                          "htmlFontSize": 16,
+                                          "overline": Object {
+                                            "fontFamily": "\\"Roboto\\", \\"Helvetica\\", \\"Arial\\", sans-serif",
+                                            "fontSize": "0.75rem",
+                                            "fontWeight": 400,
+                                            "letterSpacing": "0.08333em",
+                                            "lineHeight": 2.66,
+                                            "textTransform": "uppercase",
+                                          },
+                                          "pxToRem": [Function],
+                                          "round": [Function],
+                                          "subtitle1": Object {
+                                            "fontFamily": "\\"Roboto\\", \\"Helvetica\\", \\"Arial\\", sans-serif",
+                                            "fontSize": "1rem",
+                                            "fontWeight": 400,
+                                            "letterSpacing": "0.00938em",
+                                            "lineHeight": 1.75,
+                                          },
+                                          "subtitle2": Object {
+                                            "fontFamily": "\\"Roboto\\", \\"Helvetica\\", \\"Arial\\", sans-serif",
+                                            "fontSize": "0.875rem",
+                                            "fontWeight": 500,
+                                            "letterSpacing": "0.00714em",
+                                            "lineHeight": 1.57,
+                                          },
+                                        },
+                                        "zIndex": Object {
+                                          "appBar": 1100,
+                                          "drawer": 1200,
+                                          "mobileStepper": 1000,
+                                          "modal": 1300,
+                                          "snackbar": 1400,
+                                          "tooltip": 1500,
+                                        },
+                                      }
+                                    }
+                                    variant="h6"
+                                  >
+                                    <h6
+                                      className="MuiTypography-root Header-flex-11 Header-title-12 MuiTypography-h6 MuiTypography-colorInherit"
+                                      onClick={[Function]}
+                                    >
+                                      Foo
+                                    </h6>
+                                  </ForwardRef(Typography)>
+                                </WithStyles(ForwardRef(Typography))>
+                              </div>
+                            </ForwardRef(Toolbar)>
+                          </WithStyles(ForwardRef(Toolbar))>
+                        </header>
+                      </ForwardRef(Paper)>
+                    </WithStyles(ForwardRef(Paper))>
+                  </ForwardRef(AppBar)>
+                </WithStyles(ForwardRef(AppBar))>
+              </div>
+            </Header>
+          </WithStyles(Header)>
+          <div
+            className="BaseBranch-appFrame-1 BaseBranch-appFrameWithCookieInfo-2"
+          >
+            <WithStyles(Drawer)
+              data={
+                Array [
+                  Object {
+                    "icon": null,
+                    "title": "Dashboard",
+                    "type": "link",
+                    "url": "/",
+                  },
+                  Object {
+                    "isDisabled": true,
+                    "title": "New portfolio",
+                    "type": "link",
+                    "url": "/portfolio",
+                  },
+                  Object {
+                    "type": "divider",
+                  },
+                  Object {
+                    "icon": Object {
+                      "$$typeof": Symbol(react.memo),
+                      "compare": null,
+                      "displayName": "BugReportIcon",
+                      "muiName": "SvgIcon",
+                      "type": Object {
+                        "$$typeof": Symbol(react.forward_ref),
+                        "render": [Function],
+                      },
+                    },
+                    "title": "Report a bug",
+                    "type": "link",
+                    "url": "/bug",
+                  },
+                ]
+              }
+              isOpen={true}
+              onClose={[Function]}
+              redirectTo={[Function]}
+            >
+              <Drawer
+                classes={
+                  Object {
+                    "drawerHeader": "Drawer-drawerHeader-105",
+                    "drawerPaper": "Drawer-drawerPaper-104",
+                  }
+                }
+                data={
+                  Array [
+                    Object {
+                      "icon": null,
+                      "title": "Dashboard",
+                      "type": "link",
+                      "url": "/",
+                    },
+                    Object {
+                      "isDisabled": true,
+                      "title": "New portfolio",
+                      "type": "link",
+                      "url": "/portfolio",
+                    },
+                    Object {
+                      "type": "divider",
+                    },
+                    Object {
+                      "icon": Object {
+                        "$$typeof": Symbol(react.memo),
+                        "compare": null,
+                        "displayName": "BugReportIcon",
+                        "muiName": "SvgIcon",
+                        "type": Object {
+                          "$$typeof": Symbol(react.forward_ref),
+                          "render": [Function],
+                        },
+                      },
+                      "title": "Report a bug",
+                      "type": "link",
+                      "url": "/bug",
+                    },
+                  ]
+                }
+                isOpen={true}
+                onClose={[Function]}
+                redirectTo={[Function]}
+              >
+                <WithStyles(ForwardRef(Drawer))
+                  anchor="left"
+                  classes={
+                    Object {
+                      "paper": "Drawer-drawerPaper-104",
+                    }
+                  }
+                  open={true}
+                  variant="persistent"
+                >
+                  <ForwardRef(Drawer)
+                    anchor="left"
+                    classes={
+                      Object {
+                        "docked": "MuiDrawer-docked",
+                        "modal": "MuiDrawer-modal",
+                        "paper": "MuiDrawer-paper Drawer-drawerPaper-104",
+                        "paperAnchorBottom": "MuiDrawer-paperAnchorBottom",
+                        "paperAnchorDockedBottom": "MuiDrawer-paperAnchorDockedBottom",
+                        "paperAnchorDockedLeft": "MuiDrawer-paperAnchorDockedLeft",
+                        "paperAnchorDockedRight": "MuiDrawer-paperAnchorDockedRight",
+                        "paperAnchorDockedTop": "MuiDrawer-paperAnchorDockedTop",
+                        "paperAnchorLeft": "MuiDrawer-paperAnchorLeft",
+                        "paperAnchorRight": "MuiDrawer-paperAnchorRight",
+                        "paperAnchorTop": "MuiDrawer-paperAnchorTop",
+                        "root": "MuiDrawer-root",
+                      }
+                    }
+                    open={true}
+                    theme={
+                      Object {
+                        "breakpoints": Object {
+                          "between": [Function],
+                          "down": [Function],
+                          "keys": Array [
+                            "xs",
+                            "sm",
+                            "md",
+                            "lg",
+                            "xl",
+                          ],
+                          "only": [Function],
+                          "up": [Function],
+                          "values": Object {
+                            "lg": 1280,
+                            "md": 960,
+                            "sm": 600,
+                            "xl": 1920,
+                            "xs": 0,
+                          },
+                          "width": [Function],
+                        },
+                        "direction": "ltr",
+                        "mixins": Object {
+                          "gutters": [Function],
+                          "toolbar": Object {
+                            "@media (min-width:0px) and (orientation: landscape)": Object {
+                              "minHeight": 48,
+                            },
+                            "@media (min-width:600px)": Object {
+                              "minHeight": 64,
+                            },
+                            "minHeight": 56,
+                          },
+                        },
+                        "overrides": Object {},
+                        "palette": Object {
+                          "action": Object {
+                            "active": "rgba(0, 0, 0, 0.54)",
+                            "disabled": "rgba(0, 0, 0, 0.26)",
+                            "disabledBackground": "rgba(0, 0, 0, 0.12)",
+                            "hover": "rgba(0, 0, 0, 0.08)",
+                            "hoverOpacity": 0.08,
+                            "selected": "rgba(0, 0, 0, 0.14)",
+                          },
+                          "augmentColor": [Function],
+                          "background": Object {
+                            "default": "#fafafa",
+                            "paper": "#fff",
+                          },
+                          "common": Object {
+                            "black": "#000",
+                            "white": "#fff",
+                          },
+                          "contrastThreshold": 3,
+                          "divider": "rgba(0, 0, 0, 0.12)",
+                          "error": Object {
+                            "contrastText": "#fff",
+                            "dark": "#d32f2f",
+                            "light": "#e57373",
+                            "main": "#f44336",
+                          },
+                          "getContrastText": [Function],
+                          "grey": Object {
+                            "100": "#f5f5f5",
+                            "200": "#eeeeee",
+                            "300": "#e0e0e0",
+                            "400": "#bdbdbd",
+                            "50": "#fafafa",
+                            "500": "#9e9e9e",
+                            "600": "#757575",
+                            "700": "#616161",
+                            "800": "#424242",
+                            "900": "#212121",
+                            "A100": "#d5d5d5",
+                            "A200": "#aaaaaa",
+                            "A400": "#303030",
+                            "A700": "#616161",
+                          },
+                          "primary": Object {
+                            "contrastText": "#fff",
+                            "dark": "#303f9f",
+                            "light": "#7986cb",
+                            "main": "#3f51b5",
+                          },
+                          "secondary": Object {
+                            "contrastText": "#fff",
+                            "dark": "#c51162",
+                            "light": "#ff4081",
+                            "main": "#f50057",
+                          },
+                          "text": Object {
+                            "disabled": "rgba(0, 0, 0, 0.38)",
+                            "hint": "rgba(0, 0, 0, 0.38)",
+                            "primary": "rgba(0, 0, 0, 0.87)",
+                            "secondary": "rgba(0, 0, 0, 0.54)",
+                          },
+                          "tonalOffset": 0.2,
+                          "type": "light",
+                        },
+                        "props": Object {},
+                        "shadows": Array [
+                          "none",
+                          "0px 1px 3px 0px rgba(0,0,0,0.2),0px 1px 1px 0px rgba(0,0,0,0.14),0px 2px 1px -1px rgba(0,0,0,0.12)",
+                          "0px 1px 5px 0px rgba(0,0,0,0.2),0px 2px 2px 0px rgba(0,0,0,0.14),0px 3px 1px -2px rgba(0,0,0,0.12)",
+                          "0px 1px 8px 0px rgba(0,0,0,0.2),0px 3px 4px 0px rgba(0,0,0,0.14),0px 3px 3px -2px rgba(0,0,0,0.12)",
+                          "0px 2px 4px -1px rgba(0,0,0,0.2),0px 4px 5px 0px rgba(0,0,0,0.14),0px 1px 10px 0px rgba(0,0,0,0.12)",
+                          "0px 3px 5px -1px rgba(0,0,0,0.2),0px 5px 8px 0px rgba(0,0,0,0.14),0px 1px 14px 0px rgba(0,0,0,0.12)",
+                          "0px 3px 5px -1px rgba(0,0,0,0.2),0px 6px 10px 0px rgba(0,0,0,0.14),0px 1px 18px 0px rgba(0,0,0,0.12)",
+                          "0px 4px 5px -2px rgba(0,0,0,0.2),0px 7px 10px 1px rgba(0,0,0,0.14),0px 2px 16px 1px rgba(0,0,0,0.12)",
+                          "0px 5px 5px -3px rgba(0,0,0,0.2),0px 8px 10px 1px rgba(0,0,0,0.14),0px 3px 14px 2px rgba(0,0,0,0.12)",
+                          "0px 5px 6px -3px rgba(0,0,0,0.2),0px 9px 12px 1px rgba(0,0,0,0.14),0px 3px 16px 2px rgba(0,0,0,0.12)",
+                          "0px 6px 6px -3px rgba(0,0,0,0.2),0px 10px 14px 1px rgba(0,0,0,0.14),0px 4px 18px 3px rgba(0,0,0,0.12)",
+                          "0px 6px 7px -4px rgba(0,0,0,0.2),0px 11px 15px 1px rgba(0,0,0,0.14),0px 4px 20px 3px rgba(0,0,0,0.12)",
+                          "0px 7px 8px -4px rgba(0,0,0,0.2),0px 12px 17px 2px rgba(0,0,0,0.14),0px 5px 22px 4px rgba(0,0,0,0.12)",
+                          "0px 7px 8px -4px rgba(0,0,0,0.2),0px 13px 19px 2px rgba(0,0,0,0.14),0px 5px 24px 4px rgba(0,0,0,0.12)",
+                          "0px 7px 9px -4px rgba(0,0,0,0.2),0px 14px 21px 2px rgba(0,0,0,0.14),0px 5px 26px 4px rgba(0,0,0,0.12)",
+                          "0px 8px 9px -5px rgba(0,0,0,0.2),0px 15px 22px 2px rgba(0,0,0,0.14),0px 6px 28px 5px rgba(0,0,0,0.12)",
+                          "0px 8px 10px -5px rgba(0,0,0,0.2),0px 16px 24px 2px rgba(0,0,0,0.14),0px 6px 30px 5px rgba(0,0,0,0.12)",
+                          "0px 8px 11px -5px rgba(0,0,0,0.2),0px 17px 26px 2px rgba(0,0,0,0.14),0px 6px 32px 5px rgba(0,0,0,0.12)",
+                          "0px 9px 11px -5px rgba(0,0,0,0.2),0px 18px 28px 2px rgba(0,0,0,0.14),0px 7px 34px 6px rgba(0,0,0,0.12)",
+                          "0px 9px 12px -6px rgba(0,0,0,0.2),0px 19px 29px 2px rgba(0,0,0,0.14),0px 7px 36px 6px rgba(0,0,0,0.12)",
+                          "0px 10px 13px -6px rgba(0,0,0,0.2),0px 20px 31px 3px rgba(0,0,0,0.14),0px 8px 38px 7px rgba(0,0,0,0.12)",
+                          "0px 10px 13px -6px rgba(0,0,0,0.2),0px 21px 33px 3px rgba(0,0,0,0.14),0px 8px 40px 7px rgba(0,0,0,0.12)",
+                          "0px 10px 14px -6px rgba(0,0,0,0.2),0px 22px 35px 3px rgba(0,0,0,0.14),0px 8px 42px 7px rgba(0,0,0,0.12)",
+                          "0px 11px 14px -7px rgba(0,0,0,0.2),0px 23px 36px 3px rgba(0,0,0,0.14),0px 9px 44px 8px rgba(0,0,0,0.12)",
+                          "0px 11px 15px -7px rgba(0,0,0,0.2),0px 24px 38px 3px rgba(0,0,0,0.14),0px 9px 46px 8px rgba(0,0,0,0.12)",
+                        ],
+                        "shape": Object {
+                          "borderRadius": 4,
+                        },
+                        "spacing": [Function],
+                        "transitions": Object {
+                          "create": [Function],
+                          "duration": Object {
+                            "complex": 375,
+                            "enteringScreen": 225,
+                            "leavingScreen": 195,
+                            "short": 250,
+                            "shorter": 200,
+                            "shortest": 150,
+                            "standard": 300,
+                          },
+                          "easing": Object {
+                            "easeIn": "cubic-bezier(0.4, 0, 1, 1)",
+                            "easeInOut": "cubic-bezier(0.4, 0, 0.2, 1)",
+                            "easeOut": "cubic-bezier(0.0, 0, 0.2, 1)",
+                            "sharp": "cubic-bezier(0.4, 0, 0.6, 1)",
+                          },
+                          "getAutoHeightDuration": [Function],
+                        },
+                        "typography": Object {
+                          "body1": Object {
+                            "fontFamily": "\\"Roboto\\", \\"Helvetica\\", \\"Arial\\", sans-serif",
+                            "fontSize": "1rem",
+                            "fontWeight": 400,
+                            "letterSpacing": "0.00938em",
+                            "lineHeight": 1.5,
+                          },
+                          "body2": Object {
+                            "fontFamily": "\\"Roboto\\", \\"Helvetica\\", \\"Arial\\", sans-serif",
+                            "fontSize": "0.875rem",
+                            "fontWeight": 400,
+                            "letterSpacing": "0.01071em",
+                            "lineHeight": 1.43,
+                          },
+                          "button": Object {
+                            "fontFamily": "\\"Roboto\\", \\"Helvetica\\", \\"Arial\\", sans-serif",
+                            "fontSize": "0.875rem",
+                            "fontWeight": 500,
+                            "letterSpacing": "0.02857em",
+                            "lineHeight": 1.75,
+                            "textTransform": "uppercase",
+                          },
+                          "caption": Object {
+                            "fontFamily": "\\"Roboto\\", \\"Helvetica\\", \\"Arial\\", sans-serif",
+                            "fontSize": "0.75rem",
+                            "fontWeight": 400,
+                            "letterSpacing": "0.03333em",
+                            "lineHeight": 1.66,
+                          },
+                          "fontFamily": "\\"Roboto\\", \\"Helvetica\\", \\"Arial\\", sans-serif",
+                          "fontSize": 14,
+                          "fontWeightBold": 700,
+                          "fontWeightLight": 300,
+                          "fontWeightMedium": 500,
+                          "fontWeightRegular": 400,
+                          "h1": Object {
+                            "fontFamily": "\\"Roboto\\", \\"Helvetica\\", \\"Arial\\", sans-serif",
+                            "fontSize": "6rem",
+                            "fontWeight": 300,
+                            "letterSpacing": "-0.01562em",
+                            "lineHeight": 1,
+                          },
+                          "h2": Object {
+                            "fontFamily": "\\"Roboto\\", \\"Helvetica\\", \\"Arial\\", sans-serif",
+                            "fontSize": "3.75rem",
+                            "fontWeight": 300,
+                            "letterSpacing": "-0.00833em",
+                            "lineHeight": 1,
+                          },
+                          "h3": Object {
+                            "fontFamily": "\\"Roboto\\", \\"Helvetica\\", \\"Arial\\", sans-serif",
+                            "fontSize": "3rem",
+                            "fontWeight": 400,
+                            "letterSpacing": "0em",
+                            "lineHeight": 1.04,
+                          },
+                          "h4": Object {
+                            "fontFamily": "\\"Roboto\\", \\"Helvetica\\", \\"Arial\\", sans-serif",
+                            "fontSize": "2.125rem",
+                            "fontWeight": 400,
+                            "letterSpacing": "0.00735em",
+                            "lineHeight": 1.17,
+                          },
+                          "h5": Object {
+                            "fontFamily": "\\"Roboto\\", \\"Helvetica\\", \\"Arial\\", sans-serif",
+                            "fontSize": "1.5rem",
+                            "fontWeight": 400,
+                            "letterSpacing": "0em",
+                            "lineHeight": 1.33,
+                          },
+                          "h6": Object {
+                            "fontFamily": "\\"Roboto\\", \\"Helvetica\\", \\"Arial\\", sans-serif",
+                            "fontSize": "1.25rem",
+                            "fontWeight": 500,
+                            "letterSpacing": "0.0075em",
+                            "lineHeight": 1.6,
+                          },
+                          "htmlFontSize": 16,
+                          "overline": Object {
+                            "fontFamily": "\\"Roboto\\", \\"Helvetica\\", \\"Arial\\", sans-serif",
+                            "fontSize": "0.75rem",
+                            "fontWeight": 400,
+                            "letterSpacing": "0.08333em",
+                            "lineHeight": 2.66,
+                            "textTransform": "uppercase",
+                          },
+                          "pxToRem": [Function],
+                          "round": [Function],
+                          "subtitle1": Object {
+                            "fontFamily": "\\"Roboto\\", \\"Helvetica\\", \\"Arial\\", sans-serif",
+                            "fontSize": "1rem",
+                            "fontWeight": 400,
+                            "letterSpacing": "0.00938em",
+                            "lineHeight": 1.75,
+                          },
+                          "subtitle2": Object {
+                            "fontFamily": "\\"Roboto\\", \\"Helvetica\\", \\"Arial\\", sans-serif",
+                            "fontSize": "0.875rem",
+                            "fontWeight": 500,
+                            "letterSpacing": "0.00714em",
+                            "lineHeight": 1.57,
+                          },
+                        },
+                        "zIndex": Object {
+                          "appBar": 1100,
+                          "drawer": 1200,
+                          "mobileStepper": 1000,
+                          "modal": 1300,
+                          "snackbar": 1400,
+                          "tooltip": 1500,
+                        },
+                      }
+                    }
+                    variant="persistent"
+                  >
+                    <div
+                      className="MuiDrawer-root MuiDrawer-docked"
+                    >
+                      <WithTheme(ForwardRef(Slide))
+                        appear={true}
+                        direction="right"
+                        in={true}
+                        timeout={
+                          Object {
+                            "enter": 225,
+                            "exit": 195,
+                          }
+                        }
+                      >
+                        <ForwardRef(Slide)
+                          appear={true}
+                          direction="right"
+                          in={true}
+                          theme={
+                            Object {
+                              "breakpoints": Object {
+                                "between": [Function],
+                                "down": [Function],
+                                "keys": Array [
+                                  "xs",
+                                  "sm",
+                                  "md",
+                                  "lg",
+                                  "xl",
+                                ],
+                                "only": [Function],
+                                "up": [Function],
+                                "values": Object {
+                                  "lg": 1280,
+                                  "md": 960,
+                                  "sm": 600,
+                                  "xl": 1920,
+                                  "xs": 0,
+                                },
+                                "width": [Function],
+                              },
+                              "direction": "ltr",
+                              "mixins": Object {
+                                "gutters": [Function],
+                                "toolbar": Object {
+                                  "@media (min-width:0px) and (orientation: landscape)": Object {
+                                    "minHeight": 48,
+                                  },
+                                  "@media (min-width:600px)": Object {
+                                    "minHeight": 64,
+                                  },
+                                  "minHeight": 56,
+                                },
+                              },
+                              "overrides": Object {},
+                              "palette": Object {
+                                "action": Object {
+                                  "active": "rgba(0, 0, 0, 0.54)",
+                                  "disabled": "rgba(0, 0, 0, 0.26)",
+                                  "disabledBackground": "rgba(0, 0, 0, 0.12)",
+                                  "hover": "rgba(0, 0, 0, 0.08)",
+                                  "hoverOpacity": 0.08,
+                                  "selected": "rgba(0, 0, 0, 0.14)",
+                                },
+                                "augmentColor": [Function],
+                                "background": Object {
+                                  "default": "#fafafa",
+                                  "paper": "#fff",
+                                },
+                                "common": Object {
+                                  "black": "#000",
+                                  "white": "#fff",
+                                },
+                                "contrastThreshold": 3,
+                                "divider": "rgba(0, 0, 0, 0.12)",
+                                "error": Object {
+                                  "contrastText": "#fff",
+                                  "dark": "#d32f2f",
+                                  "light": "#e57373",
+                                  "main": "#f44336",
+                                },
+                                "getContrastText": [Function],
+                                "grey": Object {
+                                  "100": "#f5f5f5",
+                                  "200": "#eeeeee",
+                                  "300": "#e0e0e0",
+                                  "400": "#bdbdbd",
+                                  "50": "#fafafa",
+                                  "500": "#9e9e9e",
+                                  "600": "#757575",
+                                  "700": "#616161",
+                                  "800": "#424242",
+                                  "900": "#212121",
+                                  "A100": "#d5d5d5",
+                                  "A200": "#aaaaaa",
+                                  "A400": "#303030",
+                                  "A700": "#616161",
+                                },
+                                "primary": Object {
+                                  "contrastText": "#fff",
+                                  "dark": "#303f9f",
+                                  "light": "#7986cb",
+                                  "main": "#3f51b5",
+                                },
+                                "secondary": Object {
+                                  "contrastText": "#fff",
+                                  "dark": "#c51162",
+                                  "light": "#ff4081",
+                                  "main": "#f50057",
+                                },
+                                "text": Object {
+                                  "disabled": "rgba(0, 0, 0, 0.38)",
+                                  "hint": "rgba(0, 0, 0, 0.38)",
+                                  "primary": "rgba(0, 0, 0, 0.87)",
+                                  "secondary": "rgba(0, 0, 0, 0.54)",
+                                },
+                                "tonalOffset": 0.2,
+                                "type": "light",
+                              },
+                              "props": Object {},
+                              "shadows": Array [
+                                "none",
+                                "0px 1px 3px 0px rgba(0,0,0,0.2),0px 1px 1px 0px rgba(0,0,0,0.14),0px 2px 1px -1px rgba(0,0,0,0.12)",
+                                "0px 1px 5px 0px rgba(0,0,0,0.2),0px 2px 2px 0px rgba(0,0,0,0.14),0px 3px 1px -2px rgba(0,0,0,0.12)",
+                                "0px 1px 8px 0px rgba(0,0,0,0.2),0px 3px 4px 0px rgba(0,0,0,0.14),0px 3px 3px -2px rgba(0,0,0,0.12)",
+                                "0px 2px 4px -1px rgba(0,0,0,0.2),0px 4px 5px 0px rgba(0,0,0,0.14),0px 1px 10px 0px rgba(0,0,0,0.12)",
+                                "0px 3px 5px -1px rgba(0,0,0,0.2),0px 5px 8px 0px rgba(0,0,0,0.14),0px 1px 14px 0px rgba(0,0,0,0.12)",
+                                "0px 3px 5px -1px rgba(0,0,0,0.2),0px 6px 10px 0px rgba(0,0,0,0.14),0px 1px 18px 0px rgba(0,0,0,0.12)",
+                                "0px 4px 5px -2px rgba(0,0,0,0.2),0px 7px 10px 1px rgba(0,0,0,0.14),0px 2px 16px 1px rgba(0,0,0,0.12)",
+                                "0px 5px 5px -3px rgba(0,0,0,0.2),0px 8px 10px 1px rgba(0,0,0,0.14),0px 3px 14px 2px rgba(0,0,0,0.12)",
+                                "0px 5px 6px -3px rgba(0,0,0,0.2),0px 9px 12px 1px rgba(0,0,0,0.14),0px 3px 16px 2px rgba(0,0,0,0.12)",
+                                "0px 6px 6px -3px rgba(0,0,0,0.2),0px 10px 14px 1px rgba(0,0,0,0.14),0px 4px 18px 3px rgba(0,0,0,0.12)",
+                                "0px 6px 7px -4px rgba(0,0,0,0.2),0px 11px 15px 1px rgba(0,0,0,0.14),0px 4px 20px 3px rgba(0,0,0,0.12)",
+                                "0px 7px 8px -4px rgba(0,0,0,0.2),0px 12px 17px 2px rgba(0,0,0,0.14),0px 5px 22px 4px rgba(0,0,0,0.12)",
+                                "0px 7px 8px -4px rgba(0,0,0,0.2),0px 13px 19px 2px rgba(0,0,0,0.14),0px 5px 24px 4px rgba(0,0,0,0.12)",
+                                "0px 7px 9px -4px rgba(0,0,0,0.2),0px 14px 21px 2px rgba(0,0,0,0.14),0px 5px 26px 4px rgba(0,0,0,0.12)",
+                                "0px 8px 9px -5px rgba(0,0,0,0.2),0px 15px 22px 2px rgba(0,0,0,0.14),0px 6px 28px 5px rgba(0,0,0,0.12)",
+                                "0px 8px 10px -5px rgba(0,0,0,0.2),0px 16px 24px 2px rgba(0,0,0,0.14),0px 6px 30px 5px rgba(0,0,0,0.12)",
+                                "0px 8px 11px -5px rgba(0,0,0,0.2),0px 17px 26px 2px rgba(0,0,0,0.14),0px 6px 32px 5px rgba(0,0,0,0.12)",
+                                "0px 9px 11px -5px rgba(0,0,0,0.2),0px 18px 28px 2px rgba(0,0,0,0.14),0px 7px 34px 6px rgba(0,0,0,0.12)",
+                                "0px 9px 12px -6px rgba(0,0,0,0.2),0px 19px 29px 2px rgba(0,0,0,0.14),0px 7px 36px 6px rgba(0,0,0,0.12)",
+                                "0px 10px 13px -6px rgba(0,0,0,0.2),0px 20px 31px 3px rgba(0,0,0,0.14),0px 8px 38px 7px rgba(0,0,0,0.12)",
+                                "0px 10px 13px -6px rgba(0,0,0,0.2),0px 21px 33px 3px rgba(0,0,0,0.14),0px 8px 40px 7px rgba(0,0,0,0.12)",
+                                "0px 10px 14px -6px rgba(0,0,0,0.2),0px 22px 35px 3px rgba(0,0,0,0.14),0px 8px 42px 7px rgba(0,0,0,0.12)",
+                                "0px 11px 14px -7px rgba(0,0,0,0.2),0px 23px 36px 3px rgba(0,0,0,0.14),0px 9px 44px 8px rgba(0,0,0,0.12)",
+                                "0px 11px 15px -7px rgba(0,0,0,0.2),0px 24px 38px 3px rgba(0,0,0,0.14),0px 9px 46px 8px rgba(0,0,0,0.12)",
+                              ],
+                              "shape": Object {
+                                "borderRadius": 4,
+                              },
+                              "spacing": [Function],
+                              "transitions": Object {
+                                "create": [Function],
+                                "duration": Object {
+                                  "complex": 375,
+                                  "enteringScreen": 225,
+                                  "leavingScreen": 195,
+                                  "short": 250,
+                                  "shorter": 200,
+                                  "shortest": 150,
+                                  "standard": 300,
+                                },
+                                "easing": Object {
+                                  "easeIn": "cubic-bezier(0.4, 0, 1, 1)",
+                                  "easeInOut": "cubic-bezier(0.4, 0, 0.2, 1)",
+                                  "easeOut": "cubic-bezier(0.0, 0, 0.2, 1)",
+                                  "sharp": "cubic-bezier(0.4, 0, 0.6, 1)",
+                                },
+                                "getAutoHeightDuration": [Function],
+                              },
+                              "typography": Object {
+                                "body1": Object {
+                                  "fontFamily": "\\"Roboto\\", \\"Helvetica\\", \\"Arial\\", sans-serif",
+                                  "fontSize": "1rem",
+                                  "fontWeight": 400,
+                                  "letterSpacing": "0.00938em",
+                                  "lineHeight": 1.5,
+                                },
+                                "body2": Object {
+                                  "fontFamily": "\\"Roboto\\", \\"Helvetica\\", \\"Arial\\", sans-serif",
+                                  "fontSize": "0.875rem",
+                                  "fontWeight": 400,
+                                  "letterSpacing": "0.01071em",
+                                  "lineHeight": 1.43,
+                                },
+                                "button": Object {
+                                  "fontFamily": "\\"Roboto\\", \\"Helvetica\\", \\"Arial\\", sans-serif",
+                                  "fontSize": "0.875rem",
+                                  "fontWeight": 500,
+                                  "letterSpacing": "0.02857em",
+                                  "lineHeight": 1.75,
+                                  "textTransform": "uppercase",
+                                },
+                                "caption": Object {
+                                  "fontFamily": "\\"Roboto\\", \\"Helvetica\\", \\"Arial\\", sans-serif",
+                                  "fontSize": "0.75rem",
+                                  "fontWeight": 400,
+                                  "letterSpacing": "0.03333em",
+                                  "lineHeight": 1.66,
+                                },
+                                "fontFamily": "\\"Roboto\\", \\"Helvetica\\", \\"Arial\\", sans-serif",
+                                "fontSize": 14,
+                                "fontWeightBold": 700,
+                                "fontWeightLight": 300,
+                                "fontWeightMedium": 500,
+                                "fontWeightRegular": 400,
+                                "h1": Object {
+                                  "fontFamily": "\\"Roboto\\", \\"Helvetica\\", \\"Arial\\", sans-serif",
+                                  "fontSize": "6rem",
+                                  "fontWeight": 300,
+                                  "letterSpacing": "-0.01562em",
+                                  "lineHeight": 1,
+                                },
+                                "h2": Object {
+                                  "fontFamily": "\\"Roboto\\", \\"Helvetica\\", \\"Arial\\", sans-serif",
+                                  "fontSize": "3.75rem",
+                                  "fontWeight": 300,
+                                  "letterSpacing": "-0.00833em",
+                                  "lineHeight": 1,
+                                },
+                                "h3": Object {
+                                  "fontFamily": "\\"Roboto\\", \\"Helvetica\\", \\"Arial\\", sans-serif",
+                                  "fontSize": "3rem",
+                                  "fontWeight": 400,
+                                  "letterSpacing": "0em",
+                                  "lineHeight": 1.04,
+                                },
+                                "h4": Object {
+                                  "fontFamily": "\\"Roboto\\", \\"Helvetica\\", \\"Arial\\", sans-serif",
+                                  "fontSize": "2.125rem",
+                                  "fontWeight": 400,
+                                  "letterSpacing": "0.00735em",
+                                  "lineHeight": 1.17,
+                                },
+                                "h5": Object {
+                                  "fontFamily": "\\"Roboto\\", \\"Helvetica\\", \\"Arial\\", sans-serif",
+                                  "fontSize": "1.5rem",
+                                  "fontWeight": 400,
+                                  "letterSpacing": "0em",
+                                  "lineHeight": 1.33,
+                                },
+                                "h6": Object {
+                                  "fontFamily": "\\"Roboto\\", \\"Helvetica\\", \\"Arial\\", sans-serif",
+                                  "fontSize": "1.25rem",
+                                  "fontWeight": 500,
+                                  "letterSpacing": "0.0075em",
+                                  "lineHeight": 1.6,
+                                },
+                                "htmlFontSize": 16,
+                                "overline": Object {
+                                  "fontFamily": "\\"Roboto\\", \\"Helvetica\\", \\"Arial\\", sans-serif",
+                                  "fontSize": "0.75rem",
+                                  "fontWeight": 400,
+                                  "letterSpacing": "0.08333em",
+                                  "lineHeight": 2.66,
+                                  "textTransform": "uppercase",
+                                },
+                                "pxToRem": [Function],
+                                "round": [Function],
+                                "subtitle1": Object {
+                                  "fontFamily": "\\"Roboto\\", \\"Helvetica\\", \\"Arial\\", sans-serif",
+                                  "fontSize": "1rem",
+                                  "fontWeight": 400,
+                                  "letterSpacing": "0.00938em",
+                                  "lineHeight": 1.75,
+                                },
+                                "subtitle2": Object {
+                                  "fontFamily": "\\"Roboto\\", \\"Helvetica\\", \\"Arial\\", sans-serif",
+                                  "fontSize": "0.875rem",
+                                  "fontWeight": 500,
+                                  "letterSpacing": "0.00714em",
+                                  "lineHeight": 1.57,
+                                },
+                              },
+                              "zIndex": Object {
+                                "appBar": 1100,
+                                "drawer": 1200,
+                                "mobileStepper": 1000,
+                                "modal": 1300,
+                                "snackbar": 1400,
+                                "tooltip": 1500,
+                              },
+                            }
+                          }
+                          timeout={
+                            Object {
+                              "enter": 225,
+                              "exit": 195,
+                            }
+                          }
+                        >
+                          <Transition
+                            appear={true}
+                            enter={true}
+                            exit={true}
+                            in={true}
+                            mountOnEnter={false}
+                            onEnter={[Function]}
+                            onEntered={[Function]}
+                            onEntering={[Function]}
+                            onExit={[Function]}
+                            onExited={[Function]}
+                            onExiting={[Function]}
+                            timeout={
+                              Object {
+                                "enter": 225,
+                                "exit": 195,
+                              }
+                            }
+                            unmountOnExit={false}
+                          >
+                            <WithStyles(ForwardRef(Paper))
+                              className="MuiDrawer-paper Drawer-drawerPaper-104 MuiDrawer-paperAnchorLeft MuiDrawer-paperAnchorDockedLeft"
+                              elevation={0}
+                              square={true}
+                              style={
+                                Object {
+                                  "visibility": undefined,
+                                }
+                              }
+                            >
+                              <ForwardRef(Paper)
+                                className="MuiDrawer-paper Drawer-drawerPaper-104 MuiDrawer-paperAnchorLeft MuiDrawer-paperAnchorDockedLeft"
+                                classes={
+                                  Object {
+                                    "elevation0": "MuiPaper-elevation0",
+                                    "elevation1": "MuiPaper-elevation1",
+                                    "elevation10": "MuiPaper-elevation10",
+                                    "elevation11": "MuiPaper-elevation11",
+                                    "elevation12": "MuiPaper-elevation12",
+                                    "elevation13": "MuiPaper-elevation13",
+                                    "elevation14": "MuiPaper-elevation14",
+                                    "elevation15": "MuiPaper-elevation15",
+                                    "elevation16": "MuiPaper-elevation16",
+                                    "elevation17": "MuiPaper-elevation17",
+                                    "elevation18": "MuiPaper-elevation18",
+                                    "elevation19": "MuiPaper-elevation19",
+                                    "elevation2": "MuiPaper-elevation2",
+                                    "elevation20": "MuiPaper-elevation20",
+                                    "elevation21": "MuiPaper-elevation21",
+                                    "elevation22": "MuiPaper-elevation22",
+                                    "elevation23": "MuiPaper-elevation23",
+                                    "elevation24": "MuiPaper-elevation24",
+                                    "elevation3": "MuiPaper-elevation3",
+                                    "elevation4": "MuiPaper-elevation4",
+                                    "elevation5": "MuiPaper-elevation5",
+                                    "elevation6": "MuiPaper-elevation6",
+                                    "elevation7": "MuiPaper-elevation7",
+                                    "elevation8": "MuiPaper-elevation8",
+                                    "elevation9": "MuiPaper-elevation9",
+                                    "root": "MuiPaper-root",
+                                    "rounded": "MuiPaper-rounded",
+                                  }
+                                }
+                                elevation={0}
+                                square={true}
+                                style={
+                                  Object {
+                                    "visibility": undefined,
+                                  }
+                                }
+                              >
+                                <div
+                                  className="MuiPaper-root MuiPaper-elevation0 MuiDrawer-paper Drawer-drawerPaper-104 MuiDrawer-paperAnchorLeft MuiDrawer-paperAnchorDockedLeft"
+                                  style={
+                                    Object {
+                                      "visibility": undefined,
+                                    }
+                                  }
+                                >
+                                  <div>
+                                    <div
+                                      className="Drawer-drawerHeader-105"
+                                    >
+                                      <WithStyles(ForwardRef(IconButton))
+                                        onClick={[Function]}
+                                      >
+                                        <ForwardRef(IconButton)
+                                          classes={
+                                            Object {
+                                              "colorInherit": "MuiIconButton-colorInherit",
+                                              "colorPrimary": "MuiIconButton-colorPrimary",
+                                              "colorSecondary": "MuiIconButton-colorSecondary",
+                                              "disabled": "Mui-disabled",
+                                              "edgeEnd": "MuiIconButton-edgeEnd",
+                                              "edgeStart": "MuiIconButton-edgeStart",
+                                              "label": "MuiIconButton-label",
+                                              "root": "MuiIconButton-root",
+                                              "sizeSmall": "MuiIconButton-sizeSmall",
+                                            }
+                                          }
+                                          onClick={[Function]}
+                                        >
+                                          <WithStyles(ForwardRef(ButtonBase))
+                                            centerRipple={true}
+                                            className="MuiIconButton-root"
+                                            disabled={false}
+                                            focusRipple={true}
+                                            onClick={[Function]}
+                                          >
+                                            <ForwardRef(ButtonBase)
+                                              centerRipple={true}
+                                              className="MuiIconButton-root"
+                                              classes={
+                                                Object {
+                                                  "disabled": "Mui-disabled",
+                                                  "focusVisible": "Mui-focusVisible",
+                                                  "root": "MuiButtonBase-root",
+                                                }
+                                              }
+                                              disabled={false}
+                                              focusRipple={true}
+                                              onClick={[Function]}
+                                            >
+                                              <button
+                                                className="MuiButtonBase-root MuiIconButton-root"
+                                                disabled={false}
+                                                onBlur={[Function]}
+                                                onClick={[Function]}
+                                                onFocus={[Function]}
+                                                onKeyDown={[Function]}
+                                                onKeyUp={[Function]}
+                                                onMouseDown={[Function]}
+                                                onMouseLeave={[Function]}
+                                                onMouseUp={[Function]}
+                                                onTouchEnd={[Function]}
+                                                onTouchMove={[Function]}
+                                                onTouchStart={[Function]}
+                                                tabIndex={0}
+                                                type="button"
+                                              >
+                                                <span
+                                                  className="MuiIconButton-label"
+                                                >
+                                                  <ForwardRef>
+                                                    <WithStyles(ForwardRef(SvgIcon))>
+                                                      <ForwardRef(SvgIcon)
+                                                        classes={
+                                                          Object {
+                                                            "colorAction": "MuiSvgIcon-colorAction",
+                                                            "colorDisabled": "MuiSvgIcon-colorDisabled",
+                                                            "colorError": "MuiSvgIcon-colorError",
+                                                            "colorPrimary": "MuiSvgIcon-colorPrimary",
+                                                            "colorSecondary": "MuiSvgIcon-colorSecondary",
+                                                            "fontSizeInherit": "MuiSvgIcon-fontSizeInherit",
+                                                            "fontSizeLarge": "MuiSvgIcon-fontSizeLarge",
+                                                            "fontSizeSmall": "MuiSvgIcon-fontSizeSmall",
+                                                            "root": "MuiSvgIcon-root",
+                                                          }
+                                                        }
+                                                      >
+                                                        <svg
+                                                          aria-hidden="true"
+                                                          className="MuiSvgIcon-root"
+                                                          focusable="false"
+                                                          role="presentation"
+                                                          viewBox="0 0 24 24"
+                                                        >
+                                                          <path
+                                                            d="M15.41 7.41L14 6l-6 6 6 6 1.41-1.41L10.83 12z"
+                                                          />
+                                                          <path
+                                                            d="M0 0h24v24H0z"
+                                                            fill="none"
+                                                          />
+                                                        </svg>
+                                                      </ForwardRef(SvgIcon)>
+                                                    </WithStyles(ForwardRef(SvgIcon))>
+                                                  </ForwardRef>
+                                                </span>
+                                                <NoSsr>
+                                                  <WithStyles(TouchRipple)
+                                                    center={true}
+                                                  >
+                                                    <TouchRipple
+                                                      center={true}
+                                                      classes={
+                                                        Object {
+                                                          "child": "MuiTouchRipple-child",
+                                                          "childLeaving": "MuiTouchRipple-childLeaving",
+                                                          "childPulsate": "MuiTouchRipple-childPulsate",
+                                                          "ripple": "MuiTouchRipple-ripple",
+                                                          "ripplePulsate": "MuiTouchRipple-ripplePulsate",
+                                                          "rippleVisible": "MuiTouchRipple-rippleVisible",
+                                                          "root": "MuiTouchRipple-root",
+                                                        }
+                                                      }
+                                                    >
+                                                      <span
+                                                        className="MuiTouchRipple-root"
+                                                      >
+                                                        <TransitionGroup
+                                                          childFactory={[Function]}
+                                                          component={null}
+                                                          enter={true}
+                                                          exit={true}
+                                                        />
+                                                      </span>
+                                                    </TouchRipple>
+                                                  </WithStyles(TouchRipple)>
+                                                </NoSsr>
+                                              </button>
+                                            </ForwardRef(ButtonBase)>
+                                          </WithStyles(ForwardRef(ButtonBase))>
+                                        </ForwardRef(IconButton)>
+                                      </WithStyles(ForwardRef(IconButton))>
+                                    </div>
+                                    <WithStyles(ForwardRef(Divider))>
+                                      <ForwardRef(Divider)
+                                        classes={
+                                          Object {
+                                            "absolute": "MuiDivider-absolute",
+                                            "inset": "MuiDivider-inset",
+                                            "light": "MuiDivider-light",
+                                            "middle": "MuiDivider-middle",
+                                            "root": "MuiDivider-root",
+                                          }
+                                        }
+                                      >
+                                        <hr
+                                          className="MuiDivider-root"
+                                        />
+                                      </ForwardRef(Divider)>
+                                    </WithStyles(ForwardRef(Divider))>
+                                    <WithStyles(Menu)
+                                      data={
+                                        Array [
+                                          Object {
+                                            "icon": null,
+                                            "title": "Dashboard",
+                                            "type": "link",
+                                            "url": "/",
+                                          },
+                                          Object {
+                                            "isDisabled": true,
+                                            "title": "New portfolio",
+                                            "type": "link",
+                                            "url": "/portfolio",
+                                          },
+                                          Object {
+                                            "type": "divider",
+                                          },
+                                          Object {
+                                            "icon": Object {
+                                              "$$typeof": Symbol(react.memo),
+                                              "compare": null,
+                                              "displayName": "BugReportIcon",
+                                              "muiName": "SvgIcon",
+                                              "type": Object {
+                                                "$$typeof": Symbol(react.forward_ref),
+                                                "render": [Function],
+                                              },
+                                            },
+                                            "title": "Report a bug",
+                                            "type": "link",
+                                            "url": "/bug",
+                                          },
+                                        ]
+                                      }
+                                      redirectTo={[Function]}
+                                    >
+                                      <Menu
+                                        classes={
+                                          Object {
+                                            "root": "Menu-root-123",
+                                          }
+                                        }
+                                        data={
+                                          Array [
+                                            Object {
+                                              "icon": null,
+                                              "title": "Dashboard",
+                                              "type": "link",
+                                              "url": "/",
+                                            },
+                                            Object {
+                                              "isDisabled": true,
+                                              "title": "New portfolio",
+                                              "type": "link",
+                                              "url": "/portfolio",
+                                            },
+                                            Object {
+                                              "type": "divider",
+                                            },
+                                            Object {
+                                              "icon": Object {
+                                                "$$typeof": Symbol(react.memo),
+                                                "compare": null,
+                                                "displayName": "BugReportIcon",
+                                                "muiName": "SvgIcon",
+                                                "type": Object {
+                                                  "$$typeof": Symbol(react.forward_ref),
+                                                  "render": [Function],
+                                                },
+                                              },
+                                              "title": "Report a bug",
+                                              "type": "link",
+                                              "url": "/bug",
+                                            },
+                                          ]
+                                        }
+                                        redirectTo={[Function]}
+                                      >
+                                        <div
+                                          className="Menu-root-123"
+                                        >
+                                          <WithStyles(ForwardRef(List))>
+                                            <ForwardRef(List)
+                                              classes={
+                                                Object {
+                                                  "dense": "MuiList-dense",
+                                                  "padding": "MuiList-padding",
+                                                  "root": "MuiList-root",
+                                                  "subheader": "MuiList-subheader",
+                                                }
+                                              }
+                                            >
+                                              <ul
+                                                className="MuiList-root MuiList-padding"
+                                              >
+                                                <WithStyles(MenuItem)
+                                                  icon={null}
+                                                  key="menu-16.07614"
+                                                  redirectTo={[Function]}
+                                                  title="Dashboard"
+                                                  url="/"
+                                                >
+                                                  <MenuItem
+                                                    classes={
+                                                      Object {
+                                                        "isDisabled": "MenuItem-isDisabled-128",
+                                                      }
+                                                    }
+                                                    icon={null}
+                                                    isDisabled={false}
+                                                    redirectTo={[Function]}
+                                                    title="Dashboard"
+                                                    url="/"
+                                                  >
+                                                    <WithStyles(ForwardRef(ListItem))
+                                                      button={true}
+                                                      className=""
+                                                      onClick={[Function]}
+                                                    >
+                                                      <ForwardRef(ListItem)
+                                                        button={true}
+                                                        className=""
+                                                        classes={
+                                                          Object {
+                                                            "alignItemsFlexStart": "MuiListItem-alignItemsFlexStart",
+                                                            "button": "MuiListItem-button",
+                                                            "container": "MuiListItem-container",
+                                                            "dense": "MuiListItem-dense",
+                                                            "disabled": "Mui-disabled",
+                                                            "divider": "MuiListItem-divider",
+                                                            "focusVisible": "Mui-focusVisible",
+                                                            "gutters": "MuiListItem-gutters",
+                                                            "root": "MuiListItem-root",
+                                                            "secondaryAction": "MuiListItem-secondaryAction",
+                                                            "selected": "Mui-selected",
+                                                          }
+                                                        }
+                                                        onClick={[Function]}
+                                                      >
+                                                        <WithStyles(ForwardRef(ButtonBase))
+                                                          className="MuiListItem-root MuiListItem-gutters MuiListItem-button"
+                                                          component="div"
+                                                          disabled={false}
+                                                          focusVisibleClassName="Mui-focusVisible"
+                                                          onClick={[Function]}
+                                                        >
+                                                          <ForwardRef(ButtonBase)
+                                                            className="MuiListItem-root MuiListItem-gutters MuiListItem-button"
+                                                            classes={
+                                                              Object {
+                                                                "disabled": "Mui-disabled",
+                                                                "focusVisible": "Mui-focusVisible",
+                                                                "root": "MuiButtonBase-root",
+                                                              }
+                                                            }
+                                                            component="div"
+                                                            disabled={false}
+                                                            focusVisibleClassName="Mui-focusVisible"
+                                                            onClick={[Function]}
+                                                          >
+                                                            <div
+                                                              aria-disabled={false}
+                                                              className="MuiButtonBase-root MuiListItem-root MuiListItem-gutters MuiListItem-button"
+                                                              onBlur={[Function]}
+                                                              onClick={[Function]}
+                                                              onFocus={[Function]}
+                                                              onKeyDown={[Function]}
+                                                              onKeyUp={[Function]}
+                                                              onMouseDown={[Function]}
+                                                              onMouseLeave={[Function]}
+                                                              onMouseUp={[Function]}
+                                                              onTouchEnd={[Function]}
+                                                              onTouchMove={[Function]}
+                                                              onTouchStart={[Function]}
+                                                              role="button"
+                                                              tabIndex={0}
+                                                            >
+                                                              <WithStyles(ForwardRef(ListItemText))
+                                                                key=".1"
+                                                                primary="Dashboard"
+                                                              >
+                                                                <ForwardRef(ListItemText)
+                                                                  classes={
+                                                                    Object {
+                                                                      "dense": "MuiListItemText-dense",
+                                                                      "inset": "MuiListItemText-inset",
+                                                                      "multiline": "MuiListItemText-multiline",
+                                                                      "primary": "MuiListItemText-primary",
+                                                                      "root": "MuiListItemText-root",
+                                                                      "secondary": "MuiListItemText-secondary",
+                                                                    }
+                                                                  }
+                                                                  primary="Dashboard"
+                                                                >
+                                                                  <div
+                                                                    className="MuiListItemText-root"
+                                                                  >
+                                                                    <WithStyles(ForwardRef(Typography))
+                                                                      className="MuiListItemText-primary"
+                                                                      component="span"
+                                                                      variant="body1"
+                                                                    >
+                                                                      <ForwardRef(Typography)
+                                                                        className="MuiListItemText-primary"
+                                                                        classes={
+                                                                          Object {
+                                                                            "alignCenter": "MuiTypography-alignCenter",
+                                                                            "alignJustify": "MuiTypography-alignJustify",
+                                                                            "alignLeft": "MuiTypography-alignLeft",
+                                                                            "alignRight": "MuiTypography-alignRight",
+                                                                            "body1": "MuiTypography-body1",
+                                                                            "body2": "MuiTypography-body2",
+                                                                            "button": "MuiTypography-button",
+                                                                            "caption": "MuiTypography-caption",
+                                                                            "colorError": "MuiTypography-colorError",
+                                                                            "colorInherit": "MuiTypography-colorInherit",
+                                                                            "colorPrimary": "MuiTypography-colorPrimary",
+                                                                            "colorSecondary": "MuiTypography-colorSecondary",
+                                                                            "colorTextPrimary": "MuiTypography-colorTextPrimary",
+                                                                            "colorTextSecondary": "MuiTypography-colorTextSecondary",
+                                                                            "displayBlock": "MuiTypography-displayBlock",
+                                                                            "displayInline": "MuiTypography-displayInline",
+                                                                            "gutterBottom": "MuiTypography-gutterBottom",
+                                                                            "h1": "MuiTypography-h1",
+                                                                            "h2": "MuiTypography-h2",
+                                                                            "h3": "MuiTypography-h3",
+                                                                            "h4": "MuiTypography-h4",
+                                                                            "h5": "MuiTypography-h5",
+                                                                            "h6": "MuiTypography-h6",
+                                                                            "noWrap": "MuiTypography-noWrap",
+                                                                            "overline": "MuiTypography-overline",
+                                                                            "paragraph": "MuiTypography-paragraph",
+                                                                            "root": "MuiTypography-root",
+                                                                            "srOnly": "MuiTypography-srOnly",
+                                                                            "subtitle1": "MuiTypography-subtitle1",
+                                                                            "subtitle2": "MuiTypography-subtitle2",
+                                                                          }
+                                                                        }
+                                                                        component="span"
+                                                                        theme={
+                                                                          Object {
+                                                                            "breakpoints": Object {
+                                                                              "between": [Function],
+                                                                              "down": [Function],
+                                                                              "keys": Array [
+                                                                                "xs",
+                                                                                "sm",
+                                                                                "md",
+                                                                                "lg",
+                                                                                "xl",
+                                                                              ],
+                                                                              "only": [Function],
+                                                                              "up": [Function],
+                                                                              "values": Object {
+                                                                                "lg": 1280,
+                                                                                "md": 960,
+                                                                                "sm": 600,
+                                                                                "xl": 1920,
+                                                                                "xs": 0,
+                                                                              },
+                                                                              "width": [Function],
+                                                                            },
+                                                                            "direction": "ltr",
+                                                                            "mixins": Object {
+                                                                              "gutters": [Function],
+                                                                              "toolbar": Object {
+                                                                                "@media (min-width:0px) and (orientation: landscape)": Object {
+                                                                                  "minHeight": 48,
+                                                                                },
+                                                                                "@media (min-width:600px)": Object {
+                                                                                  "minHeight": 64,
+                                                                                },
+                                                                                "minHeight": 56,
+                                                                              },
+                                                                            },
+                                                                            "overrides": Object {},
+                                                                            "palette": Object {
+                                                                              "action": Object {
+                                                                                "active": "rgba(0, 0, 0, 0.54)",
+                                                                                "disabled": "rgba(0, 0, 0, 0.26)",
+                                                                                "disabledBackground": "rgba(0, 0, 0, 0.12)",
+                                                                                "hover": "rgba(0, 0, 0, 0.08)",
+                                                                                "hoverOpacity": 0.08,
+                                                                                "selected": "rgba(0, 0, 0, 0.14)",
+                                                                              },
+                                                                              "augmentColor": [Function],
+                                                                              "background": Object {
+                                                                                "default": "#fafafa",
+                                                                                "paper": "#fff",
+                                                                              },
+                                                                              "common": Object {
+                                                                                "black": "#000",
+                                                                                "white": "#fff",
+                                                                              },
+                                                                              "contrastThreshold": 3,
+                                                                              "divider": "rgba(0, 0, 0, 0.12)",
+                                                                              "error": Object {
+                                                                                "contrastText": "#fff",
+                                                                                "dark": "#d32f2f",
+                                                                                "light": "#e57373",
+                                                                                "main": "#f44336",
+                                                                              },
+                                                                              "getContrastText": [Function],
+                                                                              "grey": Object {
+                                                                                "100": "#f5f5f5",
+                                                                                "200": "#eeeeee",
+                                                                                "300": "#e0e0e0",
+                                                                                "400": "#bdbdbd",
+                                                                                "50": "#fafafa",
+                                                                                "500": "#9e9e9e",
+                                                                                "600": "#757575",
+                                                                                "700": "#616161",
+                                                                                "800": "#424242",
+                                                                                "900": "#212121",
+                                                                                "A100": "#d5d5d5",
+                                                                                "A200": "#aaaaaa",
+                                                                                "A400": "#303030",
+                                                                                "A700": "#616161",
+                                                                              },
+                                                                              "primary": Object {
+                                                                                "contrastText": "#fff",
+                                                                                "dark": "#303f9f",
+                                                                                "light": "#7986cb",
+                                                                                "main": "#3f51b5",
+                                                                              },
+                                                                              "secondary": Object {
+                                                                                "contrastText": "#fff",
+                                                                                "dark": "#c51162",
+                                                                                "light": "#ff4081",
+                                                                                "main": "#f50057",
+                                                                              },
+                                                                              "text": Object {
+                                                                                "disabled": "rgba(0, 0, 0, 0.38)",
+                                                                                "hint": "rgba(0, 0, 0, 0.38)",
+                                                                                "primary": "rgba(0, 0, 0, 0.87)",
+                                                                                "secondary": "rgba(0, 0, 0, 0.54)",
+                                                                              },
+                                                                              "tonalOffset": 0.2,
+                                                                              "type": "light",
+                                                                            },
+                                                                            "props": Object {},
+                                                                            "shadows": Array [
+                                                                              "none",
+                                                                              "0px 1px 3px 0px rgba(0,0,0,0.2),0px 1px 1px 0px rgba(0,0,0,0.14),0px 2px 1px -1px rgba(0,0,0,0.12)",
+                                                                              "0px 1px 5px 0px rgba(0,0,0,0.2),0px 2px 2px 0px rgba(0,0,0,0.14),0px 3px 1px -2px rgba(0,0,0,0.12)",
+                                                                              "0px 1px 8px 0px rgba(0,0,0,0.2),0px 3px 4px 0px rgba(0,0,0,0.14),0px 3px 3px -2px rgba(0,0,0,0.12)",
+                                                                              "0px 2px 4px -1px rgba(0,0,0,0.2),0px 4px 5px 0px rgba(0,0,0,0.14),0px 1px 10px 0px rgba(0,0,0,0.12)",
+                                                                              "0px 3px 5px -1px rgba(0,0,0,0.2),0px 5px 8px 0px rgba(0,0,0,0.14),0px 1px 14px 0px rgba(0,0,0,0.12)",
+                                                                              "0px 3px 5px -1px rgba(0,0,0,0.2),0px 6px 10px 0px rgba(0,0,0,0.14),0px 1px 18px 0px rgba(0,0,0,0.12)",
+                                                                              "0px 4px 5px -2px rgba(0,0,0,0.2),0px 7px 10px 1px rgba(0,0,0,0.14),0px 2px 16px 1px rgba(0,0,0,0.12)",
+                                                                              "0px 5px 5px -3px rgba(0,0,0,0.2),0px 8px 10px 1px rgba(0,0,0,0.14),0px 3px 14px 2px rgba(0,0,0,0.12)",
+                                                                              "0px 5px 6px -3px rgba(0,0,0,0.2),0px 9px 12px 1px rgba(0,0,0,0.14),0px 3px 16px 2px rgba(0,0,0,0.12)",
+                                                                              "0px 6px 6px -3px rgba(0,0,0,0.2),0px 10px 14px 1px rgba(0,0,0,0.14),0px 4px 18px 3px rgba(0,0,0,0.12)",
+                                                                              "0px 6px 7px -4px rgba(0,0,0,0.2),0px 11px 15px 1px rgba(0,0,0,0.14),0px 4px 20px 3px rgba(0,0,0,0.12)",
+                                                                              "0px 7px 8px -4px rgba(0,0,0,0.2),0px 12px 17px 2px rgba(0,0,0,0.14),0px 5px 22px 4px rgba(0,0,0,0.12)",
+                                                                              "0px 7px 8px -4px rgba(0,0,0,0.2),0px 13px 19px 2px rgba(0,0,0,0.14),0px 5px 24px 4px rgba(0,0,0,0.12)",
+                                                                              "0px 7px 9px -4px rgba(0,0,0,0.2),0px 14px 21px 2px rgba(0,0,0,0.14),0px 5px 26px 4px rgba(0,0,0,0.12)",
+                                                                              "0px 8px 9px -5px rgba(0,0,0,0.2),0px 15px 22px 2px rgba(0,0,0,0.14),0px 6px 28px 5px rgba(0,0,0,0.12)",
+                                                                              "0px 8px 10px -5px rgba(0,0,0,0.2),0px 16px 24px 2px rgba(0,0,0,0.14),0px 6px 30px 5px rgba(0,0,0,0.12)",
+                                                                              "0px 8px 11px -5px rgba(0,0,0,0.2),0px 17px 26px 2px rgba(0,0,0,0.14),0px 6px 32px 5px rgba(0,0,0,0.12)",
+                                                                              "0px 9px 11px -5px rgba(0,0,0,0.2),0px 18px 28px 2px rgba(0,0,0,0.14),0px 7px 34px 6px rgba(0,0,0,0.12)",
+                                                                              "0px 9px 12px -6px rgba(0,0,0,0.2),0px 19px 29px 2px rgba(0,0,0,0.14),0px 7px 36px 6px rgba(0,0,0,0.12)",
+                                                                              "0px 10px 13px -6px rgba(0,0,0,0.2),0px 20px 31px 3px rgba(0,0,0,0.14),0px 8px 38px 7px rgba(0,0,0,0.12)",
+                                                                              "0px 10px 13px -6px rgba(0,0,0,0.2),0px 21px 33px 3px rgba(0,0,0,0.14),0px 8px 40px 7px rgba(0,0,0,0.12)",
+                                                                              "0px 10px 14px -6px rgba(0,0,0,0.2),0px 22px 35px 3px rgba(0,0,0,0.14),0px 8px 42px 7px rgba(0,0,0,0.12)",
+                                                                              "0px 11px 14px -7px rgba(0,0,0,0.2),0px 23px 36px 3px rgba(0,0,0,0.14),0px 9px 44px 8px rgba(0,0,0,0.12)",
+                                                                              "0px 11px 15px -7px rgba(0,0,0,0.2),0px 24px 38px 3px rgba(0,0,0,0.14),0px 9px 46px 8px rgba(0,0,0,0.12)",
+                                                                            ],
+                                                                            "shape": Object {
+                                                                              "borderRadius": 4,
+                                                                            },
+                                                                            "spacing": [Function],
+                                                                            "transitions": Object {
+                                                                              "create": [Function],
+                                                                              "duration": Object {
+                                                                                "complex": 375,
+                                                                                "enteringScreen": 225,
+                                                                                "leavingScreen": 195,
+                                                                                "short": 250,
+                                                                                "shorter": 200,
+                                                                                "shortest": 150,
+                                                                                "standard": 300,
+                                                                              },
+                                                                              "easing": Object {
+                                                                                "easeIn": "cubic-bezier(0.4, 0, 1, 1)",
+                                                                                "easeInOut": "cubic-bezier(0.4, 0, 0.2, 1)",
+                                                                                "easeOut": "cubic-bezier(0.0, 0, 0.2, 1)",
+                                                                                "sharp": "cubic-bezier(0.4, 0, 0.6, 1)",
+                                                                              },
+                                                                              "getAutoHeightDuration": [Function],
+                                                                            },
+                                                                            "typography": Object {
+                                                                              "body1": Object {
+                                                                                "fontFamily": "\\"Roboto\\", \\"Helvetica\\", \\"Arial\\", sans-serif",
+                                                                                "fontSize": "1rem",
+                                                                                "fontWeight": 400,
+                                                                                "letterSpacing": "0.00938em",
+                                                                                "lineHeight": 1.5,
+                                                                              },
+                                                                              "body2": Object {
+                                                                                "fontFamily": "\\"Roboto\\", \\"Helvetica\\", \\"Arial\\", sans-serif",
+                                                                                "fontSize": "0.875rem",
+                                                                                "fontWeight": 400,
+                                                                                "letterSpacing": "0.01071em",
+                                                                                "lineHeight": 1.43,
+                                                                              },
+                                                                              "button": Object {
+                                                                                "fontFamily": "\\"Roboto\\", \\"Helvetica\\", \\"Arial\\", sans-serif",
+                                                                                "fontSize": "0.875rem",
+                                                                                "fontWeight": 500,
+                                                                                "letterSpacing": "0.02857em",
+                                                                                "lineHeight": 1.75,
+                                                                                "textTransform": "uppercase",
+                                                                              },
+                                                                              "caption": Object {
+                                                                                "fontFamily": "\\"Roboto\\", \\"Helvetica\\", \\"Arial\\", sans-serif",
+                                                                                "fontSize": "0.75rem",
+                                                                                "fontWeight": 400,
+                                                                                "letterSpacing": "0.03333em",
+                                                                                "lineHeight": 1.66,
+                                                                              },
+                                                                              "fontFamily": "\\"Roboto\\", \\"Helvetica\\", \\"Arial\\", sans-serif",
+                                                                              "fontSize": 14,
+                                                                              "fontWeightBold": 700,
+                                                                              "fontWeightLight": 300,
+                                                                              "fontWeightMedium": 500,
+                                                                              "fontWeightRegular": 400,
+                                                                              "h1": Object {
+                                                                                "fontFamily": "\\"Roboto\\", \\"Helvetica\\", \\"Arial\\", sans-serif",
+                                                                                "fontSize": "6rem",
+                                                                                "fontWeight": 300,
+                                                                                "letterSpacing": "-0.01562em",
+                                                                                "lineHeight": 1,
+                                                                              },
+                                                                              "h2": Object {
+                                                                                "fontFamily": "\\"Roboto\\", \\"Helvetica\\", \\"Arial\\", sans-serif",
+                                                                                "fontSize": "3.75rem",
+                                                                                "fontWeight": 300,
+                                                                                "letterSpacing": "-0.00833em",
+                                                                                "lineHeight": 1,
+                                                                              },
+                                                                              "h3": Object {
+                                                                                "fontFamily": "\\"Roboto\\", \\"Helvetica\\", \\"Arial\\", sans-serif",
+                                                                                "fontSize": "3rem",
+                                                                                "fontWeight": 400,
+                                                                                "letterSpacing": "0em",
+                                                                                "lineHeight": 1.04,
+                                                                              },
+                                                                              "h4": Object {
+                                                                                "fontFamily": "\\"Roboto\\", \\"Helvetica\\", \\"Arial\\", sans-serif",
+                                                                                "fontSize": "2.125rem",
+                                                                                "fontWeight": 400,
+                                                                                "letterSpacing": "0.00735em",
+                                                                                "lineHeight": 1.17,
+                                                                              },
+                                                                              "h5": Object {
+                                                                                "fontFamily": "\\"Roboto\\", \\"Helvetica\\", \\"Arial\\", sans-serif",
+                                                                                "fontSize": "1.5rem",
+                                                                                "fontWeight": 400,
+                                                                                "letterSpacing": "0em",
+                                                                                "lineHeight": 1.33,
+                                                                              },
+                                                                              "h6": Object {
+                                                                                "fontFamily": "\\"Roboto\\", \\"Helvetica\\", \\"Arial\\", sans-serif",
+                                                                                "fontSize": "1.25rem",
+                                                                                "fontWeight": 500,
+                                                                                "letterSpacing": "0.0075em",
+                                                                                "lineHeight": 1.6,
+                                                                              },
+                                                                              "htmlFontSize": 16,
+                                                                              "overline": Object {
+                                                                                "fontFamily": "\\"Roboto\\", \\"Helvetica\\", \\"Arial\\", sans-serif",
+                                                                                "fontSize": "0.75rem",
+                                                                                "fontWeight": 400,
+                                                                                "letterSpacing": "0.08333em",
+                                                                                "lineHeight": 2.66,
+                                                                                "textTransform": "uppercase",
+                                                                              },
+                                                                              "pxToRem": [Function],
+                                                                              "round": [Function],
+                                                                              "subtitle1": Object {
+                                                                                "fontFamily": "\\"Roboto\\", \\"Helvetica\\", \\"Arial\\", sans-serif",
+                                                                                "fontSize": "1rem",
+                                                                                "fontWeight": 400,
+                                                                                "letterSpacing": "0.00938em",
+                                                                                "lineHeight": 1.75,
+                                                                              },
+                                                                              "subtitle2": Object {
+                                                                                "fontFamily": "\\"Roboto\\", \\"Helvetica\\", \\"Arial\\", sans-serif",
+                                                                                "fontSize": "0.875rem",
+                                                                                "fontWeight": 500,
+                                                                                "letterSpacing": "0.00714em",
+                                                                                "lineHeight": 1.57,
+                                                                              },
+                                                                            },
+                                                                            "zIndex": Object {
+                                                                              "appBar": 1100,
+                                                                              "drawer": 1200,
+                                                                              "mobileStepper": 1000,
+                                                                              "modal": 1300,
+                                                                              "snackbar": 1400,
+                                                                              "tooltip": 1500,
+                                                                            },
+                                                                          }
+                                                                        }
+                                                                        variant="body1"
+                                                                      >
+                                                                        <span
+                                                                          className="MuiTypography-root MuiListItemText-primary MuiTypography-body1"
+                                                                        >
+                                                                          Dashboard
+                                                                        </span>
+                                                                      </ForwardRef(Typography)>
+                                                                    </WithStyles(ForwardRef(Typography))>
+                                                                  </div>
+                                                                </ForwardRef(ListItemText)>
+                                                              </WithStyles(ForwardRef(ListItemText))>
+                                                              <NoSsr>
+                                                                <WithStyles(TouchRipple)
+                                                                  center={false}
+                                                                >
+                                                                  <TouchRipple
+                                                                    center={false}
+                                                                    classes={
+                                                                      Object {
+                                                                        "child": "MuiTouchRipple-child",
+                                                                        "childLeaving": "MuiTouchRipple-childLeaving",
+                                                                        "childPulsate": "MuiTouchRipple-childPulsate",
+                                                                        "ripple": "MuiTouchRipple-ripple",
+                                                                        "ripplePulsate": "MuiTouchRipple-ripplePulsate",
+                                                                        "rippleVisible": "MuiTouchRipple-rippleVisible",
+                                                                        "root": "MuiTouchRipple-root",
+                                                                      }
+                                                                    }
+                                                                  >
+                                                                    <span
+                                                                      className="MuiTouchRipple-root"
+                                                                    >
+                                                                      <TransitionGroup
+                                                                        childFactory={[Function]}
+                                                                        component={null}
+                                                                        enter={true}
+                                                                        exit={true}
+                                                                      />
+                                                                    </span>
+                                                                  </TouchRipple>
+                                                                </WithStyles(TouchRipple)>
+                                                              </NoSsr>
+                                                            </div>
+                                                          </ForwardRef(ButtonBase)>
+                                                        </WithStyles(ForwardRef(ButtonBase))>
+                                                      </ForwardRef(ListItem)>
+                                                    </WithStyles(ForwardRef(ListItem))>
+                                                  </MenuItem>
+                                                </WithStyles(MenuItem)>
+                                                <WithStyles(MenuItem)
+                                                  isDisabled={true}
+                                                  key="menu-26.54394"
+                                                  redirectTo={[Function]}
+                                                  title="New portfolio"
+                                                  url="/portfolio"
+                                                >
+                                                  <MenuItem
+                                                    classes={
+                                                      Object {
+                                                        "isDisabled": "MenuItem-isDisabled-128",
+                                                      }
+                                                    }
+                                                    icon={null}
+                                                    isDisabled={true}
+                                                    redirectTo={[Function]}
+                                                    title="New portfolio"
+                                                    url="/portfolio"
+                                                  >
+                                                    <WithStyles(ForwardRef(ListItem))
+                                                      button={true}
+                                                      className="MenuItem-isDisabled-128"
+                                                      onClick={[Function]}
+                                                    >
+                                                      <ForwardRef(ListItem)
+                                                        button={true}
+                                                        className="MenuItem-isDisabled-128"
+                                                        classes={
+                                                          Object {
+                                                            "alignItemsFlexStart": "MuiListItem-alignItemsFlexStart",
+                                                            "button": "MuiListItem-button",
+                                                            "container": "MuiListItem-container",
+                                                            "dense": "MuiListItem-dense",
+                                                            "disabled": "Mui-disabled",
+                                                            "divider": "MuiListItem-divider",
+                                                            "focusVisible": "Mui-focusVisible",
+                                                            "gutters": "MuiListItem-gutters",
+                                                            "root": "MuiListItem-root",
+                                                            "secondaryAction": "MuiListItem-secondaryAction",
+                                                            "selected": "Mui-selected",
+                                                          }
+                                                        }
+                                                        onClick={[Function]}
+                                                      >
+                                                        <WithStyles(ForwardRef(ButtonBase))
+                                                          className="MuiListItem-root MenuItem-isDisabled-128 MuiListItem-gutters MuiListItem-button"
+                                                          component="div"
+                                                          disabled={false}
+                                                          focusVisibleClassName="Mui-focusVisible"
+                                                          onClick={[Function]}
+                                                        >
+                                                          <ForwardRef(ButtonBase)
+                                                            className="MuiListItem-root MenuItem-isDisabled-128 MuiListItem-gutters MuiListItem-button"
+                                                            classes={
+                                                              Object {
+                                                                "disabled": "Mui-disabled",
+                                                                "focusVisible": "Mui-focusVisible",
+                                                                "root": "MuiButtonBase-root",
+                                                              }
+                                                            }
+                                                            component="div"
+                                                            disabled={false}
+                                                            focusVisibleClassName="Mui-focusVisible"
+                                                            onClick={[Function]}
+                                                          >
+                                                            <div
+                                                              aria-disabled={false}
+                                                              className="MuiButtonBase-root MuiListItem-root MenuItem-isDisabled-128 MuiListItem-gutters MuiListItem-button"
+                                                              onBlur={[Function]}
+                                                              onClick={[Function]}
+                                                              onFocus={[Function]}
+                                                              onKeyDown={[Function]}
+                                                              onKeyUp={[Function]}
+                                                              onMouseDown={[Function]}
+                                                              onMouseLeave={[Function]}
+                                                              onMouseUp={[Function]}
+                                                              onTouchEnd={[Function]}
+                                                              onTouchMove={[Function]}
+                                                              onTouchStart={[Function]}
+                                                              role="button"
+                                                              tabIndex={0}
+                                                            >
+                                                              <WithStyles(ForwardRef(ListItemText))
+                                                                key=".1"
+                                                                primary="New portfolio"
+                                                              >
+                                                                <ForwardRef(ListItemText)
+                                                                  classes={
+                                                                    Object {
+                                                                      "dense": "MuiListItemText-dense",
+                                                                      "inset": "MuiListItemText-inset",
+                                                                      "multiline": "MuiListItemText-multiline",
+                                                                      "primary": "MuiListItemText-primary",
+                                                                      "root": "MuiListItemText-root",
+                                                                      "secondary": "MuiListItemText-secondary",
+                                                                    }
+                                                                  }
+                                                                  primary="New portfolio"
+                                                                >
+                                                                  <div
+                                                                    className="MuiListItemText-root"
+                                                                  >
+                                                                    <WithStyles(ForwardRef(Typography))
+                                                                      className="MuiListItemText-primary"
+                                                                      component="span"
+                                                                      variant="body1"
+                                                                    >
+                                                                      <ForwardRef(Typography)
+                                                                        className="MuiListItemText-primary"
+                                                                        classes={
+                                                                          Object {
+                                                                            "alignCenter": "MuiTypography-alignCenter",
+                                                                            "alignJustify": "MuiTypography-alignJustify",
+                                                                            "alignLeft": "MuiTypography-alignLeft",
+                                                                            "alignRight": "MuiTypography-alignRight",
+                                                                            "body1": "MuiTypography-body1",
+                                                                            "body2": "MuiTypography-body2",
+                                                                            "button": "MuiTypography-button",
+                                                                            "caption": "MuiTypography-caption",
+                                                                            "colorError": "MuiTypography-colorError",
+                                                                            "colorInherit": "MuiTypography-colorInherit",
+                                                                            "colorPrimary": "MuiTypography-colorPrimary",
+                                                                            "colorSecondary": "MuiTypography-colorSecondary",
+                                                                            "colorTextPrimary": "MuiTypography-colorTextPrimary",
+                                                                            "colorTextSecondary": "MuiTypography-colorTextSecondary",
+                                                                            "displayBlock": "MuiTypography-displayBlock",
+                                                                            "displayInline": "MuiTypography-displayInline",
+                                                                            "gutterBottom": "MuiTypography-gutterBottom",
+                                                                            "h1": "MuiTypography-h1",
+                                                                            "h2": "MuiTypography-h2",
+                                                                            "h3": "MuiTypography-h3",
+                                                                            "h4": "MuiTypography-h4",
+                                                                            "h5": "MuiTypography-h5",
+                                                                            "h6": "MuiTypography-h6",
+                                                                            "noWrap": "MuiTypography-noWrap",
+                                                                            "overline": "MuiTypography-overline",
+                                                                            "paragraph": "MuiTypography-paragraph",
+                                                                            "root": "MuiTypography-root",
+                                                                            "srOnly": "MuiTypography-srOnly",
+                                                                            "subtitle1": "MuiTypography-subtitle1",
+                                                                            "subtitle2": "MuiTypography-subtitle2",
+                                                                          }
+                                                                        }
+                                                                        component="span"
+                                                                        theme={
+                                                                          Object {
+                                                                            "breakpoints": Object {
+                                                                              "between": [Function],
+                                                                              "down": [Function],
+                                                                              "keys": Array [
+                                                                                "xs",
+                                                                                "sm",
+                                                                                "md",
+                                                                                "lg",
+                                                                                "xl",
+                                                                              ],
+                                                                              "only": [Function],
+                                                                              "up": [Function],
+                                                                              "values": Object {
+                                                                                "lg": 1280,
+                                                                                "md": 960,
+                                                                                "sm": 600,
+                                                                                "xl": 1920,
+                                                                                "xs": 0,
+                                                                              },
+                                                                              "width": [Function],
+                                                                            },
+                                                                            "direction": "ltr",
+                                                                            "mixins": Object {
+                                                                              "gutters": [Function],
+                                                                              "toolbar": Object {
+                                                                                "@media (min-width:0px) and (orientation: landscape)": Object {
+                                                                                  "minHeight": 48,
+                                                                                },
+                                                                                "@media (min-width:600px)": Object {
+                                                                                  "minHeight": 64,
+                                                                                },
+                                                                                "minHeight": 56,
+                                                                              },
+                                                                            },
+                                                                            "overrides": Object {},
+                                                                            "palette": Object {
+                                                                              "action": Object {
+                                                                                "active": "rgba(0, 0, 0, 0.54)",
+                                                                                "disabled": "rgba(0, 0, 0, 0.26)",
+                                                                                "disabledBackground": "rgba(0, 0, 0, 0.12)",
+                                                                                "hover": "rgba(0, 0, 0, 0.08)",
+                                                                                "hoverOpacity": 0.08,
+                                                                                "selected": "rgba(0, 0, 0, 0.14)",
+                                                                              },
+                                                                              "augmentColor": [Function],
+                                                                              "background": Object {
+                                                                                "default": "#fafafa",
+                                                                                "paper": "#fff",
+                                                                              },
+                                                                              "common": Object {
+                                                                                "black": "#000",
+                                                                                "white": "#fff",
+                                                                              },
+                                                                              "contrastThreshold": 3,
+                                                                              "divider": "rgba(0, 0, 0, 0.12)",
+                                                                              "error": Object {
+                                                                                "contrastText": "#fff",
+                                                                                "dark": "#d32f2f",
+                                                                                "light": "#e57373",
+                                                                                "main": "#f44336",
+                                                                              },
+                                                                              "getContrastText": [Function],
+                                                                              "grey": Object {
+                                                                                "100": "#f5f5f5",
+                                                                                "200": "#eeeeee",
+                                                                                "300": "#e0e0e0",
+                                                                                "400": "#bdbdbd",
+                                                                                "50": "#fafafa",
+                                                                                "500": "#9e9e9e",
+                                                                                "600": "#757575",
+                                                                                "700": "#616161",
+                                                                                "800": "#424242",
+                                                                                "900": "#212121",
+                                                                                "A100": "#d5d5d5",
+                                                                                "A200": "#aaaaaa",
+                                                                                "A400": "#303030",
+                                                                                "A700": "#616161",
+                                                                              },
+                                                                              "primary": Object {
+                                                                                "contrastText": "#fff",
+                                                                                "dark": "#303f9f",
+                                                                                "light": "#7986cb",
+                                                                                "main": "#3f51b5",
+                                                                              },
+                                                                              "secondary": Object {
+                                                                                "contrastText": "#fff",
+                                                                                "dark": "#c51162",
+                                                                                "light": "#ff4081",
+                                                                                "main": "#f50057",
+                                                                              },
+                                                                              "text": Object {
+                                                                                "disabled": "rgba(0, 0, 0, 0.38)",
+                                                                                "hint": "rgba(0, 0, 0, 0.38)",
+                                                                                "primary": "rgba(0, 0, 0, 0.87)",
+                                                                                "secondary": "rgba(0, 0, 0, 0.54)",
+                                                                              },
+                                                                              "tonalOffset": 0.2,
+                                                                              "type": "light",
+                                                                            },
+                                                                            "props": Object {},
+                                                                            "shadows": Array [
+                                                                              "none",
+                                                                              "0px 1px 3px 0px rgba(0,0,0,0.2),0px 1px 1px 0px rgba(0,0,0,0.14),0px 2px 1px -1px rgba(0,0,0,0.12)",
+                                                                              "0px 1px 5px 0px rgba(0,0,0,0.2),0px 2px 2px 0px rgba(0,0,0,0.14),0px 3px 1px -2px rgba(0,0,0,0.12)",
+                                                                              "0px 1px 8px 0px rgba(0,0,0,0.2),0px 3px 4px 0px rgba(0,0,0,0.14),0px 3px 3px -2px rgba(0,0,0,0.12)",
+                                                                              "0px 2px 4px -1px rgba(0,0,0,0.2),0px 4px 5px 0px rgba(0,0,0,0.14),0px 1px 10px 0px rgba(0,0,0,0.12)",
+                                                                              "0px 3px 5px -1px rgba(0,0,0,0.2),0px 5px 8px 0px rgba(0,0,0,0.14),0px 1px 14px 0px rgba(0,0,0,0.12)",
+                                                                              "0px 3px 5px -1px rgba(0,0,0,0.2),0px 6px 10px 0px rgba(0,0,0,0.14),0px 1px 18px 0px rgba(0,0,0,0.12)",
+                                                                              "0px 4px 5px -2px rgba(0,0,0,0.2),0px 7px 10px 1px rgba(0,0,0,0.14),0px 2px 16px 1px rgba(0,0,0,0.12)",
+                                                                              "0px 5px 5px -3px rgba(0,0,0,0.2),0px 8px 10px 1px rgba(0,0,0,0.14),0px 3px 14px 2px rgba(0,0,0,0.12)",
+                                                                              "0px 5px 6px -3px rgba(0,0,0,0.2),0px 9px 12px 1px rgba(0,0,0,0.14),0px 3px 16px 2px rgba(0,0,0,0.12)",
+                                                                              "0px 6px 6px -3px rgba(0,0,0,0.2),0px 10px 14px 1px rgba(0,0,0,0.14),0px 4px 18px 3px rgba(0,0,0,0.12)",
+                                                                              "0px 6px 7px -4px rgba(0,0,0,0.2),0px 11px 15px 1px rgba(0,0,0,0.14),0px 4px 20px 3px rgba(0,0,0,0.12)",
+                                                                              "0px 7px 8px -4px rgba(0,0,0,0.2),0px 12px 17px 2px rgba(0,0,0,0.14),0px 5px 22px 4px rgba(0,0,0,0.12)",
+                                                                              "0px 7px 8px -4px rgba(0,0,0,0.2),0px 13px 19px 2px rgba(0,0,0,0.14),0px 5px 24px 4px rgba(0,0,0,0.12)",
+                                                                              "0px 7px 9px -4px rgba(0,0,0,0.2),0px 14px 21px 2px rgba(0,0,0,0.14),0px 5px 26px 4px rgba(0,0,0,0.12)",
+                                                                              "0px 8px 9px -5px rgba(0,0,0,0.2),0px 15px 22px 2px rgba(0,0,0,0.14),0px 6px 28px 5px rgba(0,0,0,0.12)",
+                                                                              "0px 8px 10px -5px rgba(0,0,0,0.2),0px 16px 24px 2px rgba(0,0,0,0.14),0px 6px 30px 5px rgba(0,0,0,0.12)",
+                                                                              "0px 8px 11px -5px rgba(0,0,0,0.2),0px 17px 26px 2px rgba(0,0,0,0.14),0px 6px 32px 5px rgba(0,0,0,0.12)",
+                                                                              "0px 9px 11px -5px rgba(0,0,0,0.2),0px 18px 28px 2px rgba(0,0,0,0.14),0px 7px 34px 6px rgba(0,0,0,0.12)",
+                                                                              "0px 9px 12px -6px rgba(0,0,0,0.2),0px 19px 29px 2px rgba(0,0,0,0.14),0px 7px 36px 6px rgba(0,0,0,0.12)",
+                                                                              "0px 10px 13px -6px rgba(0,0,0,0.2),0px 20px 31px 3px rgba(0,0,0,0.14),0px 8px 38px 7px rgba(0,0,0,0.12)",
+                                                                              "0px 10px 13px -6px rgba(0,0,0,0.2),0px 21px 33px 3px rgba(0,0,0,0.14),0px 8px 40px 7px rgba(0,0,0,0.12)",
+                                                                              "0px 10px 14px -6px rgba(0,0,0,0.2),0px 22px 35px 3px rgba(0,0,0,0.14),0px 8px 42px 7px rgba(0,0,0,0.12)",
+                                                                              "0px 11px 14px -7px rgba(0,0,0,0.2),0px 23px 36px 3px rgba(0,0,0,0.14),0px 9px 44px 8px rgba(0,0,0,0.12)",
+                                                                              "0px 11px 15px -7px rgba(0,0,0,0.2),0px 24px 38px 3px rgba(0,0,0,0.14),0px 9px 46px 8px rgba(0,0,0,0.12)",
+                                                                            ],
+                                                                            "shape": Object {
+                                                                              "borderRadius": 4,
+                                                                            },
+                                                                            "spacing": [Function],
+                                                                            "transitions": Object {
+                                                                              "create": [Function],
+                                                                              "duration": Object {
+                                                                                "complex": 375,
+                                                                                "enteringScreen": 225,
+                                                                                "leavingScreen": 195,
+                                                                                "short": 250,
+                                                                                "shorter": 200,
+                                                                                "shortest": 150,
+                                                                                "standard": 300,
+                                                                              },
+                                                                              "easing": Object {
+                                                                                "easeIn": "cubic-bezier(0.4, 0, 1, 1)",
+                                                                                "easeInOut": "cubic-bezier(0.4, 0, 0.2, 1)",
+                                                                                "easeOut": "cubic-bezier(0.0, 0, 0.2, 1)",
+                                                                                "sharp": "cubic-bezier(0.4, 0, 0.6, 1)",
+                                                                              },
+                                                                              "getAutoHeightDuration": [Function],
+                                                                            },
+                                                                            "typography": Object {
+                                                                              "body1": Object {
+                                                                                "fontFamily": "\\"Roboto\\", \\"Helvetica\\", \\"Arial\\", sans-serif",
+                                                                                "fontSize": "1rem",
+                                                                                "fontWeight": 400,
+                                                                                "letterSpacing": "0.00938em",
+                                                                                "lineHeight": 1.5,
+                                                                              },
+                                                                              "body2": Object {
+                                                                                "fontFamily": "\\"Roboto\\", \\"Helvetica\\", \\"Arial\\", sans-serif",
+                                                                                "fontSize": "0.875rem",
+                                                                                "fontWeight": 400,
+                                                                                "letterSpacing": "0.01071em",
+                                                                                "lineHeight": 1.43,
+                                                                              },
+                                                                              "button": Object {
+                                                                                "fontFamily": "\\"Roboto\\", \\"Helvetica\\", \\"Arial\\", sans-serif",
+                                                                                "fontSize": "0.875rem",
+                                                                                "fontWeight": 500,
+                                                                                "letterSpacing": "0.02857em",
+                                                                                "lineHeight": 1.75,
+                                                                                "textTransform": "uppercase",
+                                                                              },
+                                                                              "caption": Object {
+                                                                                "fontFamily": "\\"Roboto\\", \\"Helvetica\\", \\"Arial\\", sans-serif",
+                                                                                "fontSize": "0.75rem",
+                                                                                "fontWeight": 400,
+                                                                                "letterSpacing": "0.03333em",
+                                                                                "lineHeight": 1.66,
+                                                                              },
+                                                                              "fontFamily": "\\"Roboto\\", \\"Helvetica\\", \\"Arial\\", sans-serif",
+                                                                              "fontSize": 14,
+                                                                              "fontWeightBold": 700,
+                                                                              "fontWeightLight": 300,
+                                                                              "fontWeightMedium": 500,
+                                                                              "fontWeightRegular": 400,
+                                                                              "h1": Object {
+                                                                                "fontFamily": "\\"Roboto\\", \\"Helvetica\\", \\"Arial\\", sans-serif",
+                                                                                "fontSize": "6rem",
+                                                                                "fontWeight": 300,
+                                                                                "letterSpacing": "-0.01562em",
+                                                                                "lineHeight": 1,
+                                                                              },
+                                                                              "h2": Object {
+                                                                                "fontFamily": "\\"Roboto\\", \\"Helvetica\\", \\"Arial\\", sans-serif",
+                                                                                "fontSize": "3.75rem",
+                                                                                "fontWeight": 300,
+                                                                                "letterSpacing": "-0.00833em",
+                                                                                "lineHeight": 1,
+                                                                              },
+                                                                              "h3": Object {
+                                                                                "fontFamily": "\\"Roboto\\", \\"Helvetica\\", \\"Arial\\", sans-serif",
+                                                                                "fontSize": "3rem",
+                                                                                "fontWeight": 400,
+                                                                                "letterSpacing": "0em",
+                                                                                "lineHeight": 1.04,
+                                                                              },
+                                                                              "h4": Object {
+                                                                                "fontFamily": "\\"Roboto\\", \\"Helvetica\\", \\"Arial\\", sans-serif",
+                                                                                "fontSize": "2.125rem",
+                                                                                "fontWeight": 400,
+                                                                                "letterSpacing": "0.00735em",
+                                                                                "lineHeight": 1.17,
+                                                                              },
+                                                                              "h5": Object {
+                                                                                "fontFamily": "\\"Roboto\\", \\"Helvetica\\", \\"Arial\\", sans-serif",
+                                                                                "fontSize": "1.5rem",
+                                                                                "fontWeight": 400,
+                                                                                "letterSpacing": "0em",
+                                                                                "lineHeight": 1.33,
+                                                                              },
+                                                                              "h6": Object {
+                                                                                "fontFamily": "\\"Roboto\\", \\"Helvetica\\", \\"Arial\\", sans-serif",
+                                                                                "fontSize": "1.25rem",
+                                                                                "fontWeight": 500,
+                                                                                "letterSpacing": "0.0075em",
+                                                                                "lineHeight": 1.6,
+                                                                              },
+                                                                              "htmlFontSize": 16,
+                                                                              "overline": Object {
+                                                                                "fontFamily": "\\"Roboto\\", \\"Helvetica\\", \\"Arial\\", sans-serif",
+                                                                                "fontSize": "0.75rem",
+                                                                                "fontWeight": 400,
+                                                                                "letterSpacing": "0.08333em",
+                                                                                "lineHeight": 2.66,
+                                                                                "textTransform": "uppercase",
+                                                                              },
+                                                                              "pxToRem": [Function],
+                                                                              "round": [Function],
+                                                                              "subtitle1": Object {
+                                                                                "fontFamily": "\\"Roboto\\", \\"Helvetica\\", \\"Arial\\", sans-serif",
+                                                                                "fontSize": "1rem",
+                                                                                "fontWeight": 400,
+                                                                                "letterSpacing": "0.00938em",
+                                                                                "lineHeight": 1.75,
+                                                                              },
+                                                                              "subtitle2": Object {
+                                                                                "fontFamily": "\\"Roboto\\", \\"Helvetica\\", \\"Arial\\", sans-serif",
+                                                                                "fontSize": "0.875rem",
+                                                                                "fontWeight": 500,
+                                                                                "letterSpacing": "0.00714em",
+                                                                                "lineHeight": 1.57,
+                                                                              },
+                                                                            },
+                                                                            "zIndex": Object {
+                                                                              "appBar": 1100,
+                                                                              "drawer": 1200,
+                                                                              "mobileStepper": 1000,
+                                                                              "modal": 1300,
+                                                                              "snackbar": 1400,
+                                                                              "tooltip": 1500,
+                                                                            },
+                                                                          }
+                                                                        }
+                                                                        variant="body1"
+                                                                      >
+                                                                        <span
+                                                                          className="MuiTypography-root MuiListItemText-primary MuiTypography-body1"
+                                                                        >
+                                                                          New portfolio
+                                                                        </span>
+                                                                      </ForwardRef(Typography)>
+                                                                    </WithStyles(ForwardRef(Typography))>
+                                                                  </div>
+                                                                </ForwardRef(ListItemText)>
+                                                              </WithStyles(ForwardRef(ListItemText))>
+                                                              <NoSsr>
+                                                                <WithStyles(TouchRipple)
+                                                                  center={false}
+                                                                >
+                                                                  <TouchRipple
+                                                                    center={false}
+                                                                    classes={
+                                                                      Object {
+                                                                        "child": "MuiTouchRipple-child",
+                                                                        "childLeaving": "MuiTouchRipple-childLeaving",
+                                                                        "childPulsate": "MuiTouchRipple-childPulsate",
+                                                                        "ripple": "MuiTouchRipple-ripple",
+                                                                        "ripplePulsate": "MuiTouchRipple-ripplePulsate",
+                                                                        "rippleVisible": "MuiTouchRipple-rippleVisible",
+                                                                        "root": "MuiTouchRipple-root",
+                                                                      }
+                                                                    }
+                                                                  >
+                                                                    <span
+                                                                      className="MuiTouchRipple-root"
+                                                                    >
+                                                                      <TransitionGroup
+                                                                        childFactory={[Function]}
+                                                                        component={null}
+                                                                        enter={true}
+                                                                        exit={true}
+                                                                      />
+                                                                    </span>
+                                                                  </TouchRipple>
+                                                                </WithStyles(TouchRipple)>
+                                                              </NoSsr>
+                                                            </div>
+                                                          </ForwardRef(ButtonBase)>
+                                                        </WithStyles(ForwardRef(ButtonBase))>
+                                                      </ForwardRef(ListItem)>
+                                                    </WithStyles(ForwardRef(ListItem))>
+                                                  </MenuItem>
+                                                </WithStyles(MenuItem)>
+                                                <WithStyles(ForwardRef(Divider))
+                                                  key="menu-40.08167"
+                                                >
+                                                  <ForwardRef(Divider)
+                                                    classes={
+                                                      Object {
+                                                        "absolute": "MuiDivider-absolute",
+                                                        "inset": "MuiDivider-inset",
+                                                        "light": "MuiDivider-light",
+                                                        "middle": "MuiDivider-middle",
+                                                        "root": "MuiDivider-root",
+                                                      }
+                                                    }
+                                                  >
+                                                    <hr
+                                                      className="MuiDivider-root"
+                                                    />
+                                                  </ForwardRef(Divider)>
+                                                </WithStyles(ForwardRef(Divider))>
+                                                <WithStyles(MenuItem)
+                                                  icon={
+                                                    Object {
+                                                      "$$typeof": Symbol(react.memo),
+                                                      "compare": null,
+                                                      "displayName": "BugReportIcon",
+                                                      "muiName": "SvgIcon",
+                                                      "type": Object {
+                                                        "$$typeof": Symbol(react.forward_ref),
+                                                        "render": [Function],
+                                                      },
+                                                    }
+                                                  }
+                                                  key="menu-62.65572"
+                                                  redirectTo={[Function]}
+                                                  title="Report a bug"
+                                                  url="/bug"
+                                                >
+                                                  <MenuItem
+                                                    classes={
+                                                      Object {
+                                                        "isDisabled": "MenuItem-isDisabled-128",
+                                                      }
+                                                    }
+                                                    icon={
+                                                      Object {
+                                                        "$$typeof": Symbol(react.memo),
+                                                        "compare": null,
+                                                        "displayName": "BugReportIcon",
+                                                        "muiName": "SvgIcon",
+                                                        "type": Object {
+                                                          "$$typeof": Symbol(react.forward_ref),
+                                                          "render": [Function],
+                                                        },
+                                                      }
+                                                    }
+                                                    isDisabled={false}
+                                                    redirectTo={[Function]}
+                                                    title="Report a bug"
+                                                    url="/bug"
+                                                  >
+                                                    <WithStyles(ForwardRef(ListItem))
+                                                      button={true}
+                                                      className=""
+                                                      onClick={[Function]}
+                                                    >
+                                                      <ForwardRef(ListItem)
+                                                        button={true}
+                                                        className=""
+                                                        classes={
+                                                          Object {
+                                                            "alignItemsFlexStart": "MuiListItem-alignItemsFlexStart",
+                                                            "button": "MuiListItem-button",
+                                                            "container": "MuiListItem-container",
+                                                            "dense": "MuiListItem-dense",
+                                                            "disabled": "Mui-disabled",
+                                                            "divider": "MuiListItem-divider",
+                                                            "focusVisible": "Mui-focusVisible",
+                                                            "gutters": "MuiListItem-gutters",
+                                                            "root": "MuiListItem-root",
+                                                            "secondaryAction": "MuiListItem-secondaryAction",
+                                                            "selected": "Mui-selected",
+                                                          }
+                                                        }
+                                                        onClick={[Function]}
+                                                      >
+                                                        <WithStyles(ForwardRef(ButtonBase))
+                                                          className="MuiListItem-root MuiListItem-gutters MuiListItem-button"
+                                                          component="div"
+                                                          disabled={false}
+                                                          focusVisibleClassName="Mui-focusVisible"
+                                                          onClick={[Function]}
+                                                        >
+                                                          <ForwardRef(ButtonBase)
+                                                            className="MuiListItem-root MuiListItem-gutters MuiListItem-button"
+                                                            classes={
+                                                              Object {
+                                                                "disabled": "Mui-disabled",
+                                                                "focusVisible": "Mui-focusVisible",
+                                                                "root": "MuiButtonBase-root",
+                                                              }
+                                                            }
+                                                            component="div"
+                                                            disabled={false}
+                                                            focusVisibleClassName="Mui-focusVisible"
+                                                            onClick={[Function]}
+                                                          >
+                                                            <div
+                                                              aria-disabled={false}
+                                                              className="MuiButtonBase-root MuiListItem-root MuiListItem-gutters MuiListItem-button"
+                                                              onBlur={[Function]}
+                                                              onClick={[Function]}
+                                                              onFocus={[Function]}
+                                                              onKeyDown={[Function]}
+                                                              onKeyUp={[Function]}
+                                                              onMouseDown={[Function]}
+                                                              onMouseLeave={[Function]}
+                                                              onMouseUp={[Function]}
+                                                              onTouchEnd={[Function]}
+                                                              onTouchMove={[Function]}
+                                                              onTouchStart={[Function]}
+                                                              role="button"
+                                                              tabIndex={0}
+                                                            >
+                                                              <WithStyles(ForwardRef(ListItemIcon))
+                                                                key=".0"
+                                                              >
+                                                                <ForwardRef(ListItemIcon)
+                                                                  classes={
+                                                                    Object {
+                                                                      "root": "MuiListItemIcon-root",
+                                                                    }
+                                                                  }
+                                                                >
+                                                                  <div
+                                                                    className="MuiListItemIcon-root"
+                                                                  >
+                                                                    <ForwardRef>
+                                                                      <WithStyles(ForwardRef(SvgIcon))>
+                                                                        <ForwardRef(SvgIcon)
+                                                                          classes={
+                                                                            Object {
+                                                                              "colorAction": "MuiSvgIcon-colorAction",
+                                                                              "colorDisabled": "MuiSvgIcon-colorDisabled",
+                                                                              "colorError": "MuiSvgIcon-colorError",
+                                                                              "colorPrimary": "MuiSvgIcon-colorPrimary",
+                                                                              "colorSecondary": "MuiSvgIcon-colorSecondary",
+                                                                              "fontSizeInherit": "MuiSvgIcon-fontSizeInherit",
+                                                                              "fontSizeLarge": "MuiSvgIcon-fontSizeLarge",
+                                                                              "fontSizeSmall": "MuiSvgIcon-fontSizeSmall",
+                                                                              "root": "MuiSvgIcon-root",
+                                                                            }
+                                                                          }
+                                                                        >
+                                                                          <svg
+                                                                            aria-hidden="true"
+                                                                            className="MuiSvgIcon-root"
+                                                                            focusable="false"
+                                                                            role="presentation"
+                                                                            viewBox="0 0 24 24"
+                                                                          >
+                                                                            <path
+                                                                              d="M0 0h24v24H0z"
+                                                                              fill="none"
+                                                                            />
+                                                                            <path
+                                                                              d="M20 8h-2.81c-.45-.78-1.07-1.45-1.82-1.96L17 4.41 15.59 3l-2.17 2.17C12.96 5.06 12.49 5 12 5c-.49 0-.96.06-1.41.17L8.41 3 7 4.41l1.62 1.63C7.88 6.55 7.26 7.22 6.81 8H4v2h2.09c-.05.33-.09.66-.09 1v1H4v2h2v1c0 .34.04.67.09 1H4v2h2.81c1.04 1.79 2.97 3 5.19 3s4.15-1.21 5.19-3H20v-2h-2.09c.05-.33.09-.66.09-1v-1h2v-2h-2v-1c0-.34-.04-.67-.09-1H20V8zm-6 8h-4v-2h4v2zm0-4h-4v-2h4v2z"
+                                                                            />
+                                                                          </svg>
+                                                                        </ForwardRef(SvgIcon)>
+                                                                      </WithStyles(ForwardRef(SvgIcon))>
+                                                                    </ForwardRef>
+                                                                  </div>
+                                                                </ForwardRef(ListItemIcon)>
+                                                              </WithStyles(ForwardRef(ListItemIcon))>
+                                                              <WithStyles(ForwardRef(ListItemText))
+                                                                key=".1"
+                                                                primary="Report a bug"
+                                                              >
+                                                                <ForwardRef(ListItemText)
+                                                                  classes={
+                                                                    Object {
+                                                                      "dense": "MuiListItemText-dense",
+                                                                      "inset": "MuiListItemText-inset",
+                                                                      "multiline": "MuiListItemText-multiline",
+                                                                      "primary": "MuiListItemText-primary",
+                                                                      "root": "MuiListItemText-root",
+                                                                      "secondary": "MuiListItemText-secondary",
+                                                                    }
+                                                                  }
+                                                                  primary="Report a bug"
+                                                                >
+                                                                  <div
+                                                                    className="MuiListItemText-root"
+                                                                  >
+                                                                    <WithStyles(ForwardRef(Typography))
+                                                                      className="MuiListItemText-primary"
+                                                                      component="span"
+                                                                      variant="body1"
+                                                                    >
+                                                                      <ForwardRef(Typography)
+                                                                        className="MuiListItemText-primary"
+                                                                        classes={
+                                                                          Object {
+                                                                            "alignCenter": "MuiTypography-alignCenter",
+                                                                            "alignJustify": "MuiTypography-alignJustify",
+                                                                            "alignLeft": "MuiTypography-alignLeft",
+                                                                            "alignRight": "MuiTypography-alignRight",
+                                                                            "body1": "MuiTypography-body1",
+                                                                            "body2": "MuiTypography-body2",
+                                                                            "button": "MuiTypography-button",
+                                                                            "caption": "MuiTypography-caption",
+                                                                            "colorError": "MuiTypography-colorError",
+                                                                            "colorInherit": "MuiTypography-colorInherit",
+                                                                            "colorPrimary": "MuiTypography-colorPrimary",
+                                                                            "colorSecondary": "MuiTypography-colorSecondary",
+                                                                            "colorTextPrimary": "MuiTypography-colorTextPrimary",
+                                                                            "colorTextSecondary": "MuiTypography-colorTextSecondary",
+                                                                            "displayBlock": "MuiTypography-displayBlock",
+                                                                            "displayInline": "MuiTypography-displayInline",
+                                                                            "gutterBottom": "MuiTypography-gutterBottom",
+                                                                            "h1": "MuiTypography-h1",
+                                                                            "h2": "MuiTypography-h2",
+                                                                            "h3": "MuiTypography-h3",
+                                                                            "h4": "MuiTypography-h4",
+                                                                            "h5": "MuiTypography-h5",
+                                                                            "h6": "MuiTypography-h6",
+                                                                            "noWrap": "MuiTypography-noWrap",
+                                                                            "overline": "MuiTypography-overline",
+                                                                            "paragraph": "MuiTypography-paragraph",
+                                                                            "root": "MuiTypography-root",
+                                                                            "srOnly": "MuiTypography-srOnly",
+                                                                            "subtitle1": "MuiTypography-subtitle1",
+                                                                            "subtitle2": "MuiTypography-subtitle2",
+                                                                          }
+                                                                        }
+                                                                        component="span"
+                                                                        theme={
+                                                                          Object {
+                                                                            "breakpoints": Object {
+                                                                              "between": [Function],
+                                                                              "down": [Function],
+                                                                              "keys": Array [
+                                                                                "xs",
+                                                                                "sm",
+                                                                                "md",
+                                                                                "lg",
+                                                                                "xl",
+                                                                              ],
+                                                                              "only": [Function],
+                                                                              "up": [Function],
+                                                                              "values": Object {
+                                                                                "lg": 1280,
+                                                                                "md": 960,
+                                                                                "sm": 600,
+                                                                                "xl": 1920,
+                                                                                "xs": 0,
+                                                                              },
+                                                                              "width": [Function],
+                                                                            },
+                                                                            "direction": "ltr",
+                                                                            "mixins": Object {
+                                                                              "gutters": [Function],
+                                                                              "toolbar": Object {
+                                                                                "@media (min-width:0px) and (orientation: landscape)": Object {
+                                                                                  "minHeight": 48,
+                                                                                },
+                                                                                "@media (min-width:600px)": Object {
+                                                                                  "minHeight": 64,
+                                                                                },
+                                                                                "minHeight": 56,
+                                                                              },
+                                                                            },
+                                                                            "overrides": Object {},
+                                                                            "palette": Object {
+                                                                              "action": Object {
+                                                                                "active": "rgba(0, 0, 0, 0.54)",
+                                                                                "disabled": "rgba(0, 0, 0, 0.26)",
+                                                                                "disabledBackground": "rgba(0, 0, 0, 0.12)",
+                                                                                "hover": "rgba(0, 0, 0, 0.08)",
+                                                                                "hoverOpacity": 0.08,
+                                                                                "selected": "rgba(0, 0, 0, 0.14)",
+                                                                              },
+                                                                              "augmentColor": [Function],
+                                                                              "background": Object {
+                                                                                "default": "#fafafa",
+                                                                                "paper": "#fff",
+                                                                              },
+                                                                              "common": Object {
+                                                                                "black": "#000",
+                                                                                "white": "#fff",
+                                                                              },
+                                                                              "contrastThreshold": 3,
+                                                                              "divider": "rgba(0, 0, 0, 0.12)",
+                                                                              "error": Object {
+                                                                                "contrastText": "#fff",
+                                                                                "dark": "#d32f2f",
+                                                                                "light": "#e57373",
+                                                                                "main": "#f44336",
+                                                                              },
+                                                                              "getContrastText": [Function],
+                                                                              "grey": Object {
+                                                                                "100": "#f5f5f5",
+                                                                                "200": "#eeeeee",
+                                                                                "300": "#e0e0e0",
+                                                                                "400": "#bdbdbd",
+                                                                                "50": "#fafafa",
+                                                                                "500": "#9e9e9e",
+                                                                                "600": "#757575",
+                                                                                "700": "#616161",
+                                                                                "800": "#424242",
+                                                                                "900": "#212121",
+                                                                                "A100": "#d5d5d5",
+                                                                                "A200": "#aaaaaa",
+                                                                                "A400": "#303030",
+                                                                                "A700": "#616161",
+                                                                              },
+                                                                              "primary": Object {
+                                                                                "contrastText": "#fff",
+                                                                                "dark": "#303f9f",
+                                                                                "light": "#7986cb",
+                                                                                "main": "#3f51b5",
+                                                                              },
+                                                                              "secondary": Object {
+                                                                                "contrastText": "#fff",
+                                                                                "dark": "#c51162",
+                                                                                "light": "#ff4081",
+                                                                                "main": "#f50057",
+                                                                              },
+                                                                              "text": Object {
+                                                                                "disabled": "rgba(0, 0, 0, 0.38)",
+                                                                                "hint": "rgba(0, 0, 0, 0.38)",
+                                                                                "primary": "rgba(0, 0, 0, 0.87)",
+                                                                                "secondary": "rgba(0, 0, 0, 0.54)",
+                                                                              },
+                                                                              "tonalOffset": 0.2,
+                                                                              "type": "light",
+                                                                            },
+                                                                            "props": Object {},
+                                                                            "shadows": Array [
+                                                                              "none",
+                                                                              "0px 1px 3px 0px rgba(0,0,0,0.2),0px 1px 1px 0px rgba(0,0,0,0.14),0px 2px 1px -1px rgba(0,0,0,0.12)",
+                                                                              "0px 1px 5px 0px rgba(0,0,0,0.2),0px 2px 2px 0px rgba(0,0,0,0.14),0px 3px 1px -2px rgba(0,0,0,0.12)",
+                                                                              "0px 1px 8px 0px rgba(0,0,0,0.2),0px 3px 4px 0px rgba(0,0,0,0.14),0px 3px 3px -2px rgba(0,0,0,0.12)",
+                                                                              "0px 2px 4px -1px rgba(0,0,0,0.2),0px 4px 5px 0px rgba(0,0,0,0.14),0px 1px 10px 0px rgba(0,0,0,0.12)",
+                                                                              "0px 3px 5px -1px rgba(0,0,0,0.2),0px 5px 8px 0px rgba(0,0,0,0.14),0px 1px 14px 0px rgba(0,0,0,0.12)",
+                                                                              "0px 3px 5px -1px rgba(0,0,0,0.2),0px 6px 10px 0px rgba(0,0,0,0.14),0px 1px 18px 0px rgba(0,0,0,0.12)",
+                                                                              "0px 4px 5px -2px rgba(0,0,0,0.2),0px 7px 10px 1px rgba(0,0,0,0.14),0px 2px 16px 1px rgba(0,0,0,0.12)",
+                                                                              "0px 5px 5px -3px rgba(0,0,0,0.2),0px 8px 10px 1px rgba(0,0,0,0.14),0px 3px 14px 2px rgba(0,0,0,0.12)",
+                                                                              "0px 5px 6px -3px rgba(0,0,0,0.2),0px 9px 12px 1px rgba(0,0,0,0.14),0px 3px 16px 2px rgba(0,0,0,0.12)",
+                                                                              "0px 6px 6px -3px rgba(0,0,0,0.2),0px 10px 14px 1px rgba(0,0,0,0.14),0px 4px 18px 3px rgba(0,0,0,0.12)",
+                                                                              "0px 6px 7px -4px rgba(0,0,0,0.2),0px 11px 15px 1px rgba(0,0,0,0.14),0px 4px 20px 3px rgba(0,0,0,0.12)",
+                                                                              "0px 7px 8px -4px rgba(0,0,0,0.2),0px 12px 17px 2px rgba(0,0,0,0.14),0px 5px 22px 4px rgba(0,0,0,0.12)",
+                                                                              "0px 7px 8px -4px rgba(0,0,0,0.2),0px 13px 19px 2px rgba(0,0,0,0.14),0px 5px 24px 4px rgba(0,0,0,0.12)",
+                                                                              "0px 7px 9px -4px rgba(0,0,0,0.2),0px 14px 21px 2px rgba(0,0,0,0.14),0px 5px 26px 4px rgba(0,0,0,0.12)",
+                                                                              "0px 8px 9px -5px rgba(0,0,0,0.2),0px 15px 22px 2px rgba(0,0,0,0.14),0px 6px 28px 5px rgba(0,0,0,0.12)",
+                                                                              "0px 8px 10px -5px rgba(0,0,0,0.2),0px 16px 24px 2px rgba(0,0,0,0.14),0px 6px 30px 5px rgba(0,0,0,0.12)",
+                                                                              "0px 8px 11px -5px rgba(0,0,0,0.2),0px 17px 26px 2px rgba(0,0,0,0.14),0px 6px 32px 5px rgba(0,0,0,0.12)",
+                                                                              "0px 9px 11px -5px rgba(0,0,0,0.2),0px 18px 28px 2px rgba(0,0,0,0.14),0px 7px 34px 6px rgba(0,0,0,0.12)",
+                                                                              "0px 9px 12px -6px rgba(0,0,0,0.2),0px 19px 29px 2px rgba(0,0,0,0.14),0px 7px 36px 6px rgba(0,0,0,0.12)",
+                                                                              "0px 10px 13px -6px rgba(0,0,0,0.2),0px 20px 31px 3px rgba(0,0,0,0.14),0px 8px 38px 7px rgba(0,0,0,0.12)",
+                                                                              "0px 10px 13px -6px rgba(0,0,0,0.2),0px 21px 33px 3px rgba(0,0,0,0.14),0px 8px 40px 7px rgba(0,0,0,0.12)",
+                                                                              "0px 10px 14px -6px rgba(0,0,0,0.2),0px 22px 35px 3px rgba(0,0,0,0.14),0px 8px 42px 7px rgba(0,0,0,0.12)",
+                                                                              "0px 11px 14px -7px rgba(0,0,0,0.2),0px 23px 36px 3px rgba(0,0,0,0.14),0px 9px 44px 8px rgba(0,0,0,0.12)",
+                                                                              "0px 11px 15px -7px rgba(0,0,0,0.2),0px 24px 38px 3px rgba(0,0,0,0.14),0px 9px 46px 8px rgba(0,0,0,0.12)",
+                                                                            ],
+                                                                            "shape": Object {
+                                                                              "borderRadius": 4,
+                                                                            },
+                                                                            "spacing": [Function],
+                                                                            "transitions": Object {
+                                                                              "create": [Function],
+                                                                              "duration": Object {
+                                                                                "complex": 375,
+                                                                                "enteringScreen": 225,
+                                                                                "leavingScreen": 195,
+                                                                                "short": 250,
+                                                                                "shorter": 200,
+                                                                                "shortest": 150,
+                                                                                "standard": 300,
+                                                                              },
+                                                                              "easing": Object {
+                                                                                "easeIn": "cubic-bezier(0.4, 0, 1, 1)",
+                                                                                "easeInOut": "cubic-bezier(0.4, 0, 0.2, 1)",
+                                                                                "easeOut": "cubic-bezier(0.0, 0, 0.2, 1)",
+                                                                                "sharp": "cubic-bezier(0.4, 0, 0.6, 1)",
+                                                                              },
+                                                                              "getAutoHeightDuration": [Function],
+                                                                            },
+                                                                            "typography": Object {
+                                                                              "body1": Object {
+                                                                                "fontFamily": "\\"Roboto\\", \\"Helvetica\\", \\"Arial\\", sans-serif",
+                                                                                "fontSize": "1rem",
+                                                                                "fontWeight": 400,
+                                                                                "letterSpacing": "0.00938em",
+                                                                                "lineHeight": 1.5,
+                                                                              },
+                                                                              "body2": Object {
+                                                                                "fontFamily": "\\"Roboto\\", \\"Helvetica\\", \\"Arial\\", sans-serif",
+                                                                                "fontSize": "0.875rem",
+                                                                                "fontWeight": 400,
+                                                                                "letterSpacing": "0.01071em",
+                                                                                "lineHeight": 1.43,
+                                                                              },
+                                                                              "button": Object {
+                                                                                "fontFamily": "\\"Roboto\\", \\"Helvetica\\", \\"Arial\\", sans-serif",
+                                                                                "fontSize": "0.875rem",
+                                                                                "fontWeight": 500,
+                                                                                "letterSpacing": "0.02857em",
+                                                                                "lineHeight": 1.75,
+                                                                                "textTransform": "uppercase",
+                                                                              },
+                                                                              "caption": Object {
+                                                                                "fontFamily": "\\"Roboto\\", \\"Helvetica\\", \\"Arial\\", sans-serif",
+                                                                                "fontSize": "0.75rem",
+                                                                                "fontWeight": 400,
+                                                                                "letterSpacing": "0.03333em",
+                                                                                "lineHeight": 1.66,
+                                                                              },
+                                                                              "fontFamily": "\\"Roboto\\", \\"Helvetica\\", \\"Arial\\", sans-serif",
+                                                                              "fontSize": 14,
+                                                                              "fontWeightBold": 700,
+                                                                              "fontWeightLight": 300,
+                                                                              "fontWeightMedium": 500,
+                                                                              "fontWeightRegular": 400,
+                                                                              "h1": Object {
+                                                                                "fontFamily": "\\"Roboto\\", \\"Helvetica\\", \\"Arial\\", sans-serif",
+                                                                                "fontSize": "6rem",
+                                                                                "fontWeight": 300,
+                                                                                "letterSpacing": "-0.01562em",
+                                                                                "lineHeight": 1,
+                                                                              },
+                                                                              "h2": Object {
+                                                                                "fontFamily": "\\"Roboto\\", \\"Helvetica\\", \\"Arial\\", sans-serif",
+                                                                                "fontSize": "3.75rem",
+                                                                                "fontWeight": 300,
+                                                                                "letterSpacing": "-0.00833em",
+                                                                                "lineHeight": 1,
+                                                                              },
+                                                                              "h3": Object {
+                                                                                "fontFamily": "\\"Roboto\\", \\"Helvetica\\", \\"Arial\\", sans-serif",
+                                                                                "fontSize": "3rem",
+                                                                                "fontWeight": 400,
+                                                                                "letterSpacing": "0em",
+                                                                                "lineHeight": 1.04,
+                                                                              },
+                                                                              "h4": Object {
+                                                                                "fontFamily": "\\"Roboto\\", \\"Helvetica\\", \\"Arial\\", sans-serif",
+                                                                                "fontSize": "2.125rem",
+                                                                                "fontWeight": 400,
+                                                                                "letterSpacing": "0.00735em",
+                                                                                "lineHeight": 1.17,
+                                                                              },
+                                                                              "h5": Object {
+                                                                                "fontFamily": "\\"Roboto\\", \\"Helvetica\\", \\"Arial\\", sans-serif",
+                                                                                "fontSize": "1.5rem",
+                                                                                "fontWeight": 400,
+                                                                                "letterSpacing": "0em",
+                                                                                "lineHeight": 1.33,
+                                                                              },
+                                                                              "h6": Object {
+                                                                                "fontFamily": "\\"Roboto\\", \\"Helvetica\\", \\"Arial\\", sans-serif",
+                                                                                "fontSize": "1.25rem",
+                                                                                "fontWeight": 500,
+                                                                                "letterSpacing": "0.0075em",
+                                                                                "lineHeight": 1.6,
+                                                                              },
+                                                                              "htmlFontSize": 16,
+                                                                              "overline": Object {
+                                                                                "fontFamily": "\\"Roboto\\", \\"Helvetica\\", \\"Arial\\", sans-serif",
+                                                                                "fontSize": "0.75rem",
+                                                                                "fontWeight": 400,
+                                                                                "letterSpacing": "0.08333em",
+                                                                                "lineHeight": 2.66,
+                                                                                "textTransform": "uppercase",
+                                                                              },
+                                                                              "pxToRem": [Function],
+                                                                              "round": [Function],
+                                                                              "subtitle1": Object {
+                                                                                "fontFamily": "\\"Roboto\\", \\"Helvetica\\", \\"Arial\\", sans-serif",
+                                                                                "fontSize": "1rem",
+                                                                                "fontWeight": 400,
+                                                                                "letterSpacing": "0.00938em",
+                                                                                "lineHeight": 1.75,
+                                                                              },
+                                                                              "subtitle2": Object {
+                                                                                "fontFamily": "\\"Roboto\\", \\"Helvetica\\", \\"Arial\\", sans-serif",
+                                                                                "fontSize": "0.875rem",
+                                                                                "fontWeight": 500,
+                                                                                "letterSpacing": "0.00714em",
+                                                                                "lineHeight": 1.57,
+                                                                              },
+                                                                            },
+                                                                            "zIndex": Object {
+                                                                              "appBar": 1100,
+                                                                              "drawer": 1200,
+                                                                              "mobileStepper": 1000,
+                                                                              "modal": 1300,
+                                                                              "snackbar": 1400,
+                                                                              "tooltip": 1500,
+                                                                            },
+                                                                          }
+                                                                        }
+                                                                        variant="body1"
+                                                                      >
+                                                                        <span
+                                                                          className="MuiTypography-root MuiListItemText-primary MuiTypography-body1"
+                                                                        >
+                                                                          Report a bug
+                                                                        </span>
+                                                                      </ForwardRef(Typography)>
+                                                                    </WithStyles(ForwardRef(Typography))>
+                                                                  </div>
+                                                                </ForwardRef(ListItemText)>
+                                                              </WithStyles(ForwardRef(ListItemText))>
+                                                              <NoSsr>
+                                                                <WithStyles(TouchRipple)
+                                                                  center={false}
+                                                                >
+                                                                  <TouchRipple
+                                                                    center={false}
+                                                                    classes={
+                                                                      Object {
+                                                                        "child": "MuiTouchRipple-child",
+                                                                        "childLeaving": "MuiTouchRipple-childLeaving",
+                                                                        "childPulsate": "MuiTouchRipple-childPulsate",
+                                                                        "ripple": "MuiTouchRipple-ripple",
+                                                                        "ripplePulsate": "MuiTouchRipple-ripplePulsate",
+                                                                        "rippleVisible": "MuiTouchRipple-rippleVisible",
+                                                                        "root": "MuiTouchRipple-root",
+                                                                      }
+                                                                    }
+                                                                  >
+                                                                    <span
+                                                                      className="MuiTouchRipple-root"
+                                                                    >
+                                                                      <TransitionGroup
+                                                                        childFactory={[Function]}
+                                                                        component={null}
+                                                                        enter={true}
+                                                                        exit={true}
+                                                                      />
+                                                                    </span>
+                                                                  </TouchRipple>
+                                                                </WithStyles(TouchRipple)>
+                                                              </NoSsr>
+                                                            </div>
+                                                          </ForwardRef(ButtonBase)>
+                                                        </WithStyles(ForwardRef(ButtonBase))>
+                                                      </ForwardRef(ListItem)>
+                                                    </WithStyles(ForwardRef(ListItem))>
+                                                  </MenuItem>
+                                                </WithStyles(MenuItem)>
+                                              </ul>
+                                            </ForwardRef(List)>
+                                          </WithStyles(ForwardRef(List))>
+                                        </div>
+                                      </Menu>
+                                    </WithStyles(Menu)>
+                                  </div>
+                                </div>
+                              </ForwardRef(Paper)>
+                            </WithStyles(ForwardRef(Paper))>
+                          </Transition>
+                        </ForwardRef(Slide)>
+                      </WithTheme(ForwardRef(Slide))>
+                    </div>
+                  </ForwardRef(Drawer)>
+                </WithStyles(ForwardRef(Drawer))>
+              </Drawer>
+            </WithStyles(Drawer)>
+            <main
+              className="BaseBranch-content-3 BaseBranch-contentShift-4"
+            >
+              <div
+                hasCookieInfo={true}
+                isOpen={true}
+                key=".0"
+                menuOpen={true}
+                onAccept={[Function]}
+              >
+                Foo
+              </div>
+            </main>
+          </div>
+        </div>
+      </BaseBranch>
+    </WithStyles(BaseBranch)>
+  </_class>
+</MockRouter>
 `;
 
-exports[`Base renders correctly 1`] = `
+exports[`Base click on title 1`] = `
 <div>
   <div
     className="Header-root-5"
@@ -1363,78 +10192,150 @@ exports[`Base renders correctly 1`] = `
 </div>
 `;
 
+exports[`Base renders correctly 1`] = `
+<_class
+  hasCookieInfo={true}
+  hasHeader={true}
+  isHeaderFixed={true}
+  menuData={
+    Array [
+      Object {
+        "icon": null,
+        "title": "Dashboard",
+        "type": "link",
+        "url": "/",
+      },
+      Object {
+        "isDisabled": true,
+        "title": "New portfolio",
+        "type": "link",
+        "url": "/portfolio",
+      },
+      Object {
+        "type": "divider",
+      },
+      Object {
+        "icon": Object {
+          "$$typeof": Symbol(react.memo),
+          "compare": null,
+          "displayName": "BugReportIcon",
+          "muiName": "SvgIcon",
+          "type": Object {
+            "$$typeof": Symbol(react.forward_ref),
+            "render": [Function],
+          },
+        },
+        "title": "Report a bug",
+        "type": "link",
+        "url": "/bug",
+      },
+    ]
+  }
+  menuOpen={true}
+  rightContent={null}
+  title="Foo"
+>
+  <div>
+    Foo
+  </div>
+</_class>
+`;
+
 exports[`Base renders correctly without header 1`] = `
-<div>
-  <div
-    className="BaseBranch-appFrame-1 BaseBranch-appFrameWithCookieInfo-2"
-  >
-    <main
-      className="BaseBranch-content-3 BaseBranch-contentShift-4"
-    >
-      <div
-        hasCookieInfo={true}
-        history={
-          Object {
-            "createHref": [Function],
-            "path": "",
-            "push": [Function],
-            "replace": [Function],
-          }
-        }
-        isOpen={true}
-        key=".0"
-        location=""
-        match={
-          Object {
-            "params": Object {},
-            "path": "",
-            "url": "",
-          }
-        }
-        menuOpen={true}
-        onAccept={[Function]}
-      >
-        Foo
-      </div>
-    </main>
+<_class
+  hasCookieInfo={true}
+  hasHeader={false}
+  isHeaderFixed={true}
+  menuData={
+    Array [
+      Object {
+        "icon": null,
+        "title": "Dashboard",
+        "type": "link",
+        "url": "/",
+      },
+      Object {
+        "isDisabled": true,
+        "title": "New portfolio",
+        "type": "link",
+        "url": "/portfolio",
+      },
+      Object {
+        "type": "divider",
+      },
+      Object {
+        "icon": Object {
+          "$$typeof": Symbol(react.memo),
+          "compare": null,
+          "displayName": "BugReportIcon",
+          "muiName": "SvgIcon",
+          "type": Object {
+            "$$typeof": Symbol(react.forward_ref),
+            "render": [Function],
+          },
+        },
+        "title": "Report a bug",
+        "type": "link",
+        "url": "/bug",
+      },
+    ]
+  }
+  menuOpen={true}
+  rightContent={null}
+  title="Foo"
+>
+  <div>
+    Foo
   </div>
-</div>
+</_class>
 `;
 
 exports[`Base renders with drawer open 1`] = `
-<div>
-  <div
-    className="BaseBranch-appFrame-1 BaseBranch-appFrameWithCookieInfo-2"
-  >
-    <main
-      className="BaseBranch-content-3 BaseBranch-contentShift-4"
-    >
-      <div
-        hasCookieInfo={true}
-        history={
-          Object {
-            "createHref": [Function],
-            "path": "",
-            "push": [Function],
-            "replace": [Function],
-          }
-        }
-        isOpen={true}
-        key=".0"
-        location=""
-        match={
-          Object {
-            "params": Object {},
-            "path": "",
-            "url": "",
-          }
-        }
-        menuOpen={true}
-        onAccept={[Function]}
-      >
-        Foo
-      </div>
-    </main>
+<_class
+  hasCookieInfo={true}
+  hasHeader={false}
+  isHeaderFixed={true}
+  isOpen={true}
+  menuData={
+    Array [
+      Object {
+        "icon": null,
+        "title": "Dashboard",
+        "type": "link",
+        "url": "/",
+      },
+      Object {
+        "isDisabled": true,
+        "title": "New portfolio",
+        "type": "link",
+        "url": "/portfolio",
+      },
+      Object {
+        "type": "divider",
+      },
+      Object {
+        "icon": Object {
+          "$$typeof": Symbol(react.memo),
+          "compare": null,
+          "displayName": "BugReportIcon",
+          "muiName": "SvgIcon",
+          "type": Object {
+            "$$typeof": Symbol(react.forward_ref),
+            "render": [Function],
+          },
+        },
+        "title": "Report a bug",
+        "type": "link",
+        "url": "/bug",
+      },
+    ]
+  }
+  menuOpen={true}
+  rightContent={null}
+  title="Foo"
+>
+  <div>
+    Foo
   </div>
-</div>
+</_class>
 `;
diff --git a/src/Confirm/Confirm.test.jsx b/src/Confirm/Confirm.test.jsx
index 14faae5..7a74f74 100644
--- a/src/Confirm/Confirm.test.jsx
+++ b/src/Confirm/Confirm.test.jsx
@@ -1,14 +1,14 @@
 import React from 'react'
-import Enzyme, { shallow, mount } from 'enzyme'
+import Enzyme, { shallow } from 'enzyme'
 import Adapter from 'enzyme-adapter-react-16'
 
-import Confirm from './'
+import Confirm from '.'
 
 Enzyme.configure({ adapter: new Adapter() })
 
 describe('Confirm', () => {
   it('renders correctly', () => {
-    const tree = mount(<Confirm
+    const tree = shallow(<Confirm
       title="Title"
       description="Desc"
       onConfirm={() => { }}
@@ -18,7 +18,7 @@ describe('Confirm', () => {
   })
 
   it('renders correctly without close button', () => {
-    const tree = mount(<Confirm
+    const tree = shallow(<Confirm
       title="Title"
       description="Desc"
       onConfirm={() => { }}
diff --git a/src/Confirm/__snapshots__/Confirm.test.jsx.snap b/src/Confirm/__snapshots__/Confirm.test.jsx.snap
index f8feb9b..800dc67 100644
--- a/src/Confirm/__snapshots__/Confirm.test.jsx.snap
+++ b/src/Confirm/__snapshots__/Confirm.test.jsx.snap
@@ -1,5 +1,27 @@
 // Jest Snapshot v1, https://goo.gl/fbAQLP
 
-exports[`Confirm renders correctly 1`] = `""`;
+exports[`Confirm renders correctly 1`] = `
+<WithStyles(ConfirmBranch)
+  agreeText="Agree"
+  description="Desc"
+  disagreeText="Disagree"
+  hasCloseButton={true}
+  isOpen={false}
+  onClose={[Function]}
+  onConfirm={[Function]}
+  title="Title"
+/>
+`;
 
-exports[`Confirm renders correctly without close button 1`] = `""`;
+exports[`Confirm renders correctly without close button 1`] = `
+<WithStyles(ConfirmBranch)
+  agreeText="Agree"
+  description="Desc"
+  disagreeText="Disagree"
+  hasCloseButton={false}
+  isOpen={false}
+  onClose={[Function]}
+  onConfirm={[Function]}
+  title="Title"
+/>
+`;
diff --git a/src/CookieInfo/CookieInfo.test.jsx b/src/CookieInfo/CookieInfo.test.jsx
index 9ac0817..7a32b6c 100644
--- a/src/CookieInfo/CookieInfo.test.jsx
+++ b/src/CookieInfo/CookieInfo.test.jsx
@@ -1,16 +1,16 @@
 import React from 'react'
-import Enzyme, { mount } from 'enzyme'
+import Enzyme, { shallow } from 'enzyme'
 import Adapter from 'enzyme-adapter-react-16'
 import { Button } from '@material-ui/core'
 
-import CookieInfo from './'
+import CookieInfo from '.'
 
 Enzyme.configure({ adapter: new Adapter() })
 
 
 describe('Component Info', () => {
   it('renders correctly', () => {
-    const tree = mount(<CookieInfo cookieInfoOpen>Foo</CookieInfo>)
+    const tree = shallow(<CookieInfo cookieInfoOpen>Foo</CookieInfo>)
 
     expect(tree).toMatchSnapshot()
   })
@@ -18,7 +18,7 @@ describe('Component Info', () => {
   it('click away', () => {
     const mockCallBack = jest.fn()
 
-    const cookieInfo = mount((
+    const cookieInfo = shallow((
       <CookieInfo
         isOpen
         onAccept={mockCallBack}
diff --git a/src/CookieInfo/__snapshots__/CookieInfo.test.jsx.snap b/src/CookieInfo/__snapshots__/CookieInfo.test.jsx.snap
index 6dbd3d3..a4987f1 100644
--- a/src/CookieInfo/__snapshots__/CookieInfo.test.jsx.snap
+++ b/src/CookieInfo/__snapshots__/CookieInfo.test.jsx.snap
@@ -1,40 +1,20 @@
 // Jest Snapshot v1, https://goo.gl/fbAQLP
 
 exports[`Component Info renders correctly 1`] = `
-<div
-  className="CookieInfo-root-1"
+<CookieInfo
+  buttonText="Accept"
+  classes={
+    Object {
+      "button": "CookieInfo-button-4",
+      "content": "CookieInfo-content-3",
+      "root": "CookieInfo-root-1",
+      "rootActive": "CookieInfo-rootActive-2",
+    }
+  }
+  cookieInfoOpen={true}
+  isOpen={false}
+  onAccept={null}
 >
-  <div
-    className="CookieInfo-content-3"
-  >
-    Foo
-  </div>
-  <button
-    className="MuiButtonBase-root-31 MuiButton-root-5 MuiButton-text-7 MuiButton-flat-10 CookieInfo-button-4"
-    disabled={false}
-    onBlur={[Function]}
-    onClick={[Function]}
-    onContextMenu={[Function]}
-    onFocus={[Function]}
-    onKeyDown={[Function]}
-    onKeyUp={[Function]}
-    onMouseDown={[Function]}
-    onMouseLeave={[Function]}
-    onMouseUp={[Function]}
-    onTouchEnd={[Function]}
-    onTouchMove={[Function]}
-    onTouchStart={[Function]}
-    tabIndex="0"
-    type="button"
-  >
-    <span
-      className="MuiButton-label-6"
-    >
-      Accept
-    </span>
-    <span
-      className="MuiTouchRipple-root-34"
-    />
-  </button>
-</div>
+  Foo
+</CookieInfo>
 `;
diff --git a/src/Dashboard/Dashboard.test.jsx b/src/Dashboard/Dashboard.test.jsx
index f2cd351..923285f 100644
--- a/src/Dashboard/Dashboard.test.jsx
+++ b/src/Dashboard/Dashboard.test.jsx
@@ -1,11 +1,11 @@
 import React from 'react'
 import { BrowserRouter as Router } from 'react-router-dom'
-import { mount } from 'enzyme'
+import { shallow } from 'enzyme'
 
-import Dashboard from './'
+import Dashboard from '.'
 
 it('renders correctly', () => {
-  const tree = mount((
+  const tree = shallow((
     <Router>
       <Dashboard
         data={{
diff --git a/src/Dashboard/DashboardCard.test.jsx b/src/Dashboard/DashboardCard.test.jsx
index 83407be..8437ebb 100644
--- a/src/Dashboard/DashboardCard.test.jsx
+++ b/src/Dashboard/DashboardCard.test.jsx
@@ -1,10 +1,10 @@
 import React from 'react'
-import { mount } from 'enzyme'
+import { shallow } from 'enzyme'
 
 import DashboardCard from './DashboardCard'
 
 it('renders correctly', () => {
-  const tree = mount(<DashboardCard
+  const tree = shallow(<DashboardCard
     title="Title"
     description="desc"
     handleClick={() => { }}
@@ -15,7 +15,7 @@ it('renders correctly', () => {
 
 
 it('renders disabled', () => {
-  const tree = mount((
+  const tree = shallow((
     <DashboardCard
       title="Title"
       description="desc"
diff --git a/src/Dashboard/DashboardGroup.test.jsx b/src/Dashboard/DashboardGroup.test.jsx
index 7e1a8f4..a152deb 100644
--- a/src/Dashboard/DashboardGroup.test.jsx
+++ b/src/Dashboard/DashboardGroup.test.jsx
@@ -1,10 +1,10 @@
 import React from 'react'
-import { mount } from 'enzyme'
+import { shallow } from 'enzyme'
 
 import DashboardGroup from './DashboardGroup'
 
 it('renders correctly', () => {
-  const tree = mount(<DashboardGroup
+  const tree = shallow(<DashboardGroup
     title="Title"
     cards={[{
       title: 'title',
diff --git a/src/Dashboard/__snapshots__/Dashboard.test.jsx.snap b/src/Dashboard/__snapshots__/Dashboard.test.jsx.snap
index c278177..9026571 100644
--- a/src/Dashboard/__snapshots__/Dashboard.test.jsx.snap
+++ b/src/Dashboard/__snapshots__/Dashboard.test.jsx.snap
@@ -1,60 +1,46 @@
 // Jest Snapshot v1, https://goo.gl/fbAQLP
 
 exports[`renders correctly 1`] = `
-<div
-  className="DashboardBranch-root-1"
+<Router
+  history={
+    Object {
+      "action": "POP",
+      "block": [Function],
+      "createHref": [Function],
+      "go": [Function],
+      "goBack": [Function],
+      "goForward": [Function],
+      "length": 1,
+      "listen": [Function],
+      "location": Object {
+        "hash": "",
+        "pathname": "/",
+        "search": "",
+        "state": undefined,
+      },
+      "push": [Function],
+      "replace": [Function],
+    }
+  }
 >
-  <div
-    className="DashboardBranch-headline-2"
-  >
-    <h3
-      className="MuiTypography-root-3 MuiTypography-h3-17"
-    >
-      Backoffice
-    </h3>
-    <p
-      className="MuiTypography-root-3 MuiTypography-body2-11"
-    >
-      Visual Testing for Backoffice Framework
-    </p>
-  </div>
-  <div>
-    <div
-      className="DashboardGroup-headline-39"
-    >
-      <h5
-        className="MuiTypography-root-3 MuiTypography-h5-19"
-      >
-        Title
-      </h5>
-    </div>
-    <div
-      className="MuiGrid-container-40 MuiGrid-spacing-xs-16-63"
-    >
-      <div
-        className="MuiGrid-item-41 MuiGrid-grid-xs-12-80 MuiGrid-grid-sm-4-86"
-      >
-        <div
-          className="MuiPaper-root-144 MuiPaper-elevation1-147 MuiPaper-rounded-145 MuiCard-root-143 DashboardCard-root-137"
-          onClick={[Function]}
-        >
-          <div
-            className="MuiCardContent-root-171 DashboardCard-content-138"
-          >
-            <h2
-              className="MuiTypography-root-3 MuiTypography-h5-19 DashboardCard-title-140"
-            >
-              title
-            </h2>
-            <p
-              className="MuiTypography-root-3 MuiTypography-body2-11"
-            >
-              desc
-            </p>
-          </div>
-        </div>
-      </div>
-    </div>
-  </div>
-</div>
+  <withRouter(_class)
+    data={
+      Object {
+        "description": "Visual Testing for Backoffice Framework",
+        "groups": Array [
+          Object {
+            "cards": Array [
+              Object {
+                "description": "desc",
+                "title": "title",
+              },
+            ],
+            "title": "Title",
+          },
+        ],
+        "title": "Backoffice",
+      }
+    }
+  />
+</Router>
 `;
diff --git a/src/Dashboard/__snapshots__/DashboardCard.test.jsx.snap b/src/Dashboard/__snapshots__/DashboardCard.test.jsx.snap
index a2d3f51..6163c81 100644
--- a/src/Dashboard/__snapshots__/DashboardCard.test.jsx.snap
+++ b/src/Dashboard/__snapshots__/DashboardCard.test.jsx.snap
@@ -1,60 +1,41 @@
 // Jest Snapshot v1, https://goo.gl/fbAQLP
 
 exports[`renders correctly 1`] = `
-<div
-  className="MuiPaper-root-8 MuiPaper-elevation1-11 MuiPaper-rounded-9 MuiCard-root-7 DashboardCard-root-1"
-  onClick={[Function]}
->
-  <div
-    className="MuiCardContent-root-35 DashboardCard-content-2"
-  >
-    <h2
-      className="MuiTypography-root-36 MuiTypography-h5-52 DashboardCard-title-4"
-    >
-      Title
-    </h2>
-    <p
-      className="MuiTypography-root-36 MuiTypography-body2-44"
-    >
-      desc
-    </p>
-  </div>
-</div>
+<DashboardCard
+  classes={
+    Object {
+      "avatar": "DashboardCard-avatar-3",
+      "content": "DashboardCard-content-2",
+      "disabled": "DashboardCard-disabled-5",
+      "icon": "DashboardCard-icon-6",
+      "root": "DashboardCard-root-1",
+      "title": "DashboardCard-title-4",
+    }
+  }
+  description="desc"
+  handleClick={[Function]}
+  icon={null}
+  isDisabled={false}
+  title="Title"
+/>
 `;
 
 exports[`renders disabled 1`] = `
-<div
-  className="MuiPaper-root-8 MuiPaper-elevation1-11 MuiPaper-rounded-9 MuiCard-root-7 DashboardCard-root-1 DashboardCard-disabled-5"
-  onClick={[Function]}
->
-  <div
-    className="MuiCardContent-root-35 DashboardCard-content-2"
-  >
-    <svg
-      aria-hidden="true"
-      className="MuiSvgIcon-root-72 DashboardCard-icon-6"
-      focusable="false"
-      role="presentation"
-      viewBox="0 0 24 24"
-    >
-      <path
-        d="M0 0h24v24H0z"
-        fill="none"
-      />
-      <path
-        d="M18 8h-1V6c0-2.76-2.24-5-5-5S7 3.24 7 6v2H6c-1.1 0-2 .9-2 2v10c0 1.1.9 2 2 2h12c1.1 0 2-.9 2-2V10c0-1.1-.9-2-2-2zm-6 9c-1.1 0-2-.9-2-2s.9-2 2-2 2 .9 2 2-.9 2-2 2zm3.1-9H8.9V6c0-1.71 1.39-3.1 3.1-3.1 1.71 0 3.1 1.39 3.1 3.1v2z"
-      />
-    </svg>
-    <h2
-      className="MuiTypography-root-36 MuiTypography-h5-52 DashboardCard-title-4"
-    >
-      Title
-    </h2>
-    <p
-      className="MuiTypography-root-36 MuiTypography-body2-44"
-    >
-      desc
-    </p>
-  </div>
-</div>
+<DashboardCard
+  classes={
+    Object {
+      "avatar": "DashboardCard-avatar-3",
+      "content": "DashboardCard-content-2",
+      "disabled": "DashboardCard-disabled-5",
+      "icon": "DashboardCard-icon-6",
+      "root": "DashboardCard-root-1",
+      "title": "DashboardCard-title-4",
+    }
+  }
+  description="desc"
+  handleClick={[Function]}
+  icon={null}
+  isDisabled={true}
+  title="Title"
+/>
 `;
diff --git a/src/Dashboard/__snapshots__/DashboardGroup.test.jsx.snap b/src/Dashboard/__snapshots__/DashboardGroup.test.jsx.snap
index 7446e97..7960af2 100644
--- a/src/Dashboard/__snapshots__/DashboardGroup.test.jsx.snap
+++ b/src/Dashboard/__snapshots__/DashboardGroup.test.jsx.snap
@@ -1,42 +1,21 @@
 // Jest Snapshot v1, https://goo.gl/fbAQLP
 
 exports[`renders correctly 1`] = `
-<div>
-  <div
-    className="DashboardGroup-headline-1"
-  >
-    <h5
-      className="MuiTypography-root-2 MuiTypography-h5-18"
-    >
-      Title
-    </h5>
-  </div>
-  <div
-    className="MuiGrid-container-38 MuiGrid-spacing-xs-16-61"
-  >
-    <div
-      className="MuiGrid-item-39 MuiGrid-grid-xs-12-78 MuiGrid-grid-sm-4-84"
-    >
-      <div
-        className="MuiPaper-root-142 MuiPaper-elevation1-145 MuiPaper-rounded-143 MuiCard-root-141 DashboardCard-root-135"
-        onClick={[Function]}
-      >
-        <div
-          className="MuiCardContent-root-169 DashboardCard-content-136"
-        >
-          <h2
-            className="MuiTypography-root-2 MuiTypography-h5-18 DashboardCard-title-138"
-          >
-            title
-          </h2>
-          <p
-            className="MuiTypography-root-2 MuiTypography-body2-10"
-          >
-            desc
-          </p>
-        </div>
-      </div>
-    </div>
-  </div>
-</div>
+<DashboardGroup
+  cards={
+    Array [
+      Object {
+        "description": "desc",
+        "title": "title",
+      },
+    ]
+  }
+  classes={
+    Object {
+      "headline": "DashboardGroup-headline-1",
+    }
+  }
+  onClick={[Function]}
+  title="Title"
+/>
 `;
diff --git a/src/Drawer/Drawer.test.jsx b/src/Drawer/Drawer.test.jsx
index 9447741..33a933f 100644
--- a/src/Drawer/Drawer.test.jsx
+++ b/src/Drawer/Drawer.test.jsx
@@ -1,12 +1,12 @@
 import React from 'react'
-import { mount } from 'enzyme'
+import { shallow } from 'enzyme'
 
-import menuData from '../../__tests__/data/menu'
+import menuData from '../tests/data/menu'
 
-import Drawer from './'
+import Drawer from '.'
 
 it('renders correctly', () => {
-  const tree = mount(<Drawer
+  const tree = shallow(<Drawer
     isOpen
     data={menuData}
     onClose={() => {}}
diff --git a/src/Drawer/__snapshots__/Drawer.test.jsx.snap b/src/Drawer/__snapshots__/Drawer.test.jsx.snap
index 0458b4c..5bb31da 100644
--- a/src/Drawer/__snapshots__/Drawer.test.jsx.snap
+++ b/src/Drawer/__snapshots__/Drawer.test.jsx.snap
@@ -1,183 +1,49 @@
 // Jest Snapshot v1, https://goo.gl/fbAQLP
 
 exports[`renders correctly 1`] = `
-<div
-  className="MuiDrawer-root-3 MuiDrawer-docked-4"
->
-  <div
-    className="MuiPaper-root-15 MuiPaper-elevation0-17 MuiDrawer-paper-5 Drawer-drawerPaper-1 MuiDrawer-paperAnchorLeft-6 MuiDrawer-paperAnchorDockedLeft-10"
-    style={Object {}}
-  >
-    <div>
-      <div
-        className="Drawer-drawerHeader-2"
-      >
-        <button
-          className="MuiButtonBase-root-48 MuiIconButton-root-42"
-          disabled={false}
-          onBlur={[Function]}
-          onClick={[Function]}
-          onContextMenu={[Function]}
-          onFocus={[Function]}
-          onKeyDown={[Function]}
-          onKeyUp={[Function]}
-          onMouseDown={[Function]}
-          onMouseLeave={[Function]}
-          onMouseUp={[Function]}
-          onTouchEnd={[Function]}
-          onTouchMove={[Function]}
-          onTouchStart={[Function]}
-          tabIndex="0"
-          type="button"
-        >
-          <span
-            className="MuiIconButton-label-47"
-          >
-            <svg
-              aria-hidden="true"
-              className="MuiSvgIcon-root-51"
-              focusable="false"
-              role="presentation"
-              viewBox="0 0 24 24"
-            >
-              <path
-                d="M15.41 7.41L14 6l-6 6 6 6 1.41-1.41L10.83 12z"
-              />
-              <path
-                d="M0 0h24v24H0z"
-                fill="none"
-              />
-            </svg>
-          </span>
-          <span
-            className="MuiTouchRipple-root-126"
-          />
-        </button>
-      </div>
-      <hr
-        className="MuiDivider-root-60"
-      />
-      <div
-        className="Menu-root-65"
-      >
-        <ul
-          className="MuiList-root-66 MuiList-padding-67"
-        >
-          <div
-            className="MuiButtonBase-root-48 MuiListItem-root-71 MuiListItem-default-74 MuiListItem-gutters-79 MuiListItem-button-80"
-            onBlur={[Function]}
-            onClick={[Function]}
-            onContextMenu={[Function]}
-            onFocus={[Function]}
-            onKeyDown={[Function]}
-            onKeyUp={[Function]}
-            onMouseDown={[Function]}
-            onMouseLeave={[Function]}
-            onMouseUp={[Function]}
-            onTouchEnd={[Function]}
-            onTouchMove={[Function]}
-            onTouchStart={[Function]}
-            role="button"
-            tabIndex="0"
-          >
-            <div
-              className="MuiListItemText-root-83"
-            >
-              <span
-                className="MuiTypography-root-89 MuiTypography-subheading-96 MuiListItemText-primary-86"
-              >
-                Dashboard
-              </span>
-            </div>
-            <span
-              className="MuiTouchRipple-root-126"
-            />
-          </div>
-          <div
-            className="MuiButtonBase-root-48 MuiListItem-root-71 MuiListItem-default-74 MuiListItem-gutters-79 MuiListItem-button-80 MenuItem-isDisabled-70"
-            onBlur={[Function]}
-            onClick={[Function]}
-            onContextMenu={[Function]}
-            onFocus={[Function]}
-            onKeyDown={[Function]}
-            onKeyUp={[Function]}
-            onMouseDown={[Function]}
-            onMouseLeave={[Function]}
-            onMouseUp={[Function]}
-            onTouchEnd={[Function]}
-            onTouchMove={[Function]}
-            onTouchStart={[Function]}
-            role="button"
-            tabIndex="0"
-          >
-            <div
-              className="MuiListItemText-root-83"
-            >
-              <span
-                className="MuiTypography-root-89 MuiTypography-subheading-96 MuiListItemText-primary-86"
-              >
-                New portfolio
-              </span>
-            </div>
-            <span
-              className="MuiTouchRipple-root-126"
-            />
-          </div>
-          <hr
-            className="MuiDivider-root-60"
-          />
-          <div
-            className="MuiButtonBase-root-48 MuiListItem-root-71 MuiListItem-default-74 MuiListItem-gutters-79 MuiListItem-button-80"
-            onBlur={[Function]}
-            onClick={[Function]}
-            onContextMenu={[Function]}
-            onFocus={[Function]}
-            onKeyDown={[Function]}
-            onKeyUp={[Function]}
-            onMouseDown={[Function]}
-            onMouseLeave={[Function]}
-            onMouseUp={[Function]}
-            onTouchEnd={[Function]}
-            onTouchMove={[Function]}
-            onTouchStart={[Function]}
-            role="button"
-            tabIndex="0"
-          >
-            <div
-              className="MuiListItemIcon-root-125"
-            >
-              <svg
-                aria-hidden="true"
-                className="MuiSvgIcon-root-51"
-                focusable="false"
-                role="presentation"
-                viewBox="0 0 24 24"
-              >
-                <path
-                  d="M0 0h24v24H0z"
-                  fill="none"
-                />
-                <path
-                  d="M20 8h-2.81c-.45-.78-1.07-1.45-1.82-1.96L17 4.41 15.59 3l-2.17 2.17C12.96 5.06 12.49 5 12 5c-.49 0-.96.06-1.41.17L8.41 3 7 4.41l1.62 1.63C7.88 6.55 7.26 7.22 6.81 8H4v2h2.09c-.05.33-.09.66-.09 1v1H4v2h2v1c0 .34.04.67.09 1H4v2h2.81c1.04 1.79 2.97 3 5.19 3s4.15-1.21 5.19-3H20v-2h-2.09c.05-.33.09-.66.09-1v-1h2v-2h-2v-1c0-.34-.04-.67-.09-1H20V8zm-6 8h-4v-2h4v2zm0-4h-4v-2h4v2z"
-                />
-              </svg>
-            </div>
-            <div
-              className="MuiListItemText-root-83"
-            >
-              <span
-                className="MuiTypography-root-89 MuiTypography-subheading-96 MuiListItemText-primary-86"
-              >
-                Report a bug
-              </span>
-            </div>
-            <span
-              className="MuiTouchRipple-root-126"
-            />
-          </div>
-        </ul>
-      </div>
-    </div>
-  </div>
-</div>
+<Drawer
+  classes={
+    Object {
+      "drawerHeader": "Drawer-drawerHeader-2",
+      "drawerPaper": "Drawer-drawerPaper-1",
+    }
+  }
+  data={
+    Array [
+      Object {
+        "icon": null,
+        "title": "Dashboard",
+        "type": "link",
+        "url": "/",
+      },
+      Object {
+        "isDisabled": true,
+        "title": "New portfolio",
+        "type": "link",
+        "url": "/portfolio",
+      },
+      Object {
+        "type": "divider",
+      },
+      Object {
+        "icon": Object {
+          "$$typeof": Symbol(react.memo),
+          "compare": null,
+          "displayName": "BugReportIcon",
+          "muiName": "SvgIcon",
+          "type": Object {
+            "$$typeof": Symbol(react.forward_ref),
+            "render": [Function],
+          },
+        },
+        "title": "Report a bug",
+        "type": "link",
+        "url": "/bug",
+      },
+    ]
+  }
+  isOpen={true}
+  onClose={[Function]}
+  redirectTo={[Function]}
+/>
 `;
diff --git a/src/Form/Form.test.jsx b/src/Form/Form.test.jsx
index 253de3f..0e9655e 100644
--- a/src/Form/Form.test.jsx
+++ b/src/Form/Form.test.jsx
@@ -1,13 +1,13 @@
 import React from 'react'
 import { MemoryRouter } from 'react-router-dom'
-import { mount } from 'enzyme'
+import { shallow } from 'enzyme'
 
-import Form from './'
+import Form from '.'
 
-import formData from '../../__tests__/data/form'
+import formData from '../tests/data/form'
 
 it('renders correctly', () => {
-  const tree = mount((
+  const tree = shallow((
     <MemoryRouter>
       <Form
         data={{
@@ -28,7 +28,7 @@ it('renders correctly', () => {
 })
 
 it('renders correctly with content', () => {
-  const tree = mount((
+  const tree = shallow((
     <MemoryRouter>
       <Form
         data={{
diff --git a/src/Form/FormField.test.jsx b/src/Form/FormField.test.jsx
index e567a6d..8377768 100644
--- a/src/Form/FormField.test.jsx
+++ b/src/Form/FormField.test.jsx
@@ -1,5 +1,5 @@
 import React from 'react'
-import Enzyme, { mount } from 'enzyme'
+import Enzyme, { shallow } from 'enzyme'
 import Adapter from 'enzyme-adapter-react-16'
 import { ListItem, Chip } from '@material-ui/core'
 
@@ -11,7 +11,7 @@ Enzyme.configure({ adapter: new Adapter() })
 describe('Form Field', () => {
   it('handles change', () => {
     const handleChange = jest.fn()
-    const field = mount((
+    const field = shallow((
       <FormField
         id="1"
         title="Foo"
@@ -28,7 +28,7 @@ describe('Form Field', () => {
   })
 
   it('renders non-visible', () => {
-    const field = mount((
+    const field = shallow((
       <FormField
         id="2"
         title="Foo"
@@ -47,7 +47,7 @@ describe('Form Field', () => {
 
   it('renders calls beforeSubmit function, handles number', () => {
     const beforeSubmit = jest.fn()
-    const field = mount((
+    const field = shallow((
       <FormField
         id="3"
         title="Foo"
@@ -65,7 +65,7 @@ describe('Form Field', () => {
   })
 
   it('handles list', () => {
-    const field = mount((
+    const field = shallow((
       <FormField
         id="4"
         title="Foo"
@@ -83,7 +83,7 @@ describe('Form Field', () => {
   })
 
   it('handles list with allowed values', () => {
-    const field = mount((
+    const field = shallow((
       <FormField
         id="5"
         title="Foo"
@@ -107,7 +107,7 @@ describe('Form Field', () => {
   })
 
   it('handles list delete', () => {
-    const field = mount((
+    const field = shallow((
       <FormField
         id="5a"
         title="Foo"
@@ -129,7 +129,7 @@ describe('Form Field', () => {
 
   it('renders list item via function', () => {
     const renderElement = jest.fn()
-    const field = mount((
+    const field = shallow((
       <FormField
         id="5b"
         title="Foo"
@@ -146,7 +146,7 @@ describe('Form Field', () => {
   })
 
   it('does not render if there is no option', () => {
-    const field = mount((
+    const field = shallow((
       <FormField
         id="5b"
         title="Foo"
@@ -163,7 +163,7 @@ describe('Form Field', () => {
   })
 
   it('handles datetime field', () => {
-    const field = mount((
+    const field = shallow((
       <FormField
         id="6"
         title="Foo"
@@ -183,7 +183,7 @@ describe('Form Field', () => {
   })
 
   it('handles date field', () => {
-    const field = mount((
+    const field = shallow((
       <FormField
         id="6"
         title="Foo"
@@ -203,7 +203,7 @@ describe('Form Field', () => {
   })
 
   it('handles time field', () => {
-    const field = mount((
+    const field = shallow((
       <FormField
         id="6"
         title="Foo"
@@ -229,7 +229,7 @@ describe('Form Field', () => {
       message: 'Value should equal `test`',
     }
 
-    const field = mount((
+    const field = shallow((
       <FormField
         id="7"
         title="Foo"
diff --git a/src/Form/FormFieldInput.test.jsx b/src/Form/FormFieldInput.test.jsx
index e1e697d..6541114 100644
--- a/src/Form/FormFieldInput.test.jsx
+++ b/src/Form/FormFieldInput.test.jsx
@@ -1,10 +1,10 @@
 import React from 'react'
-import { mount } from 'enzyme'
+import { shallow } from 'enzyme'
 
 import FormFieldInput from './FormFieldInput'
 
 it('renders correctly', () => {
-  const tree = mount((
+  const tree = shallow((
     <FormFieldInput />
   ))
 
@@ -13,7 +13,7 @@ it('renders correctly', () => {
 
 
 it('renders disabled', () => {
-  const tree = mount((
+  const tree = shallow((
     <FormFieldInput
       isDisabled
     />
diff --git a/src/Form/FormFieldSwitch.test.jsx b/src/Form/FormFieldSwitch.test.jsx
index ea8dd63..1760c67 100644
--- a/src/Form/FormFieldSwitch.test.jsx
+++ b/src/Form/FormFieldSwitch.test.jsx
@@ -1,10 +1,10 @@
 import React from 'react'
-import { mount } from 'enzyme'
+import { shallow } from 'enzyme'
 
 import FormFieldSwitch from './FormFieldSwitch'
 
 it('renders correctly', () => {
-  const tree = mount((
+  const tree = shallow((
     <FormFieldSwitch
       id="switch"
       title="Title"
@@ -16,7 +16,7 @@ it('renders correctly', () => {
 })
 
 it('renders disabled', () => {
-  const tree = mount((
+  const tree = shallow((
     <FormFieldSwitch
       id="switch"
       title="Title"
@@ -29,7 +29,7 @@ it('renders disabled', () => {
 })
 
 it('renders with helper text', () => {
-  const tree = mount((
+  const tree = shallow((
     <FormFieldSwitch
       id="switch"
       title="Title"
diff --git a/src/Form/__snapshots__/Form.test.jsx.snap b/src/Form/__snapshots__/Form.test.jsx.snap
index acd1137..76e6149 100644
--- a/src/Form/__snapshots__/Form.test.jsx.snap
+++ b/src/Form/__snapshots__/Form.test.jsx.snap
@@ -1,2190 +1,587 @@
 // Jest Snapshot v1, https://goo.gl/fbAQLP
 
 exports[`renders correctly 1`] = `
-<form
-  autoComplete="off"
-  noValidate={true}
+<Router
+  history={
+    Object {
+      "action": "POP",
+      "block": [Function],
+      "canGo": [Function],
+      "createHref": [Function],
+      "entries": Array [
+        Object {
+          "hash": "",
+          "key": "cj6ltz",
+          "pathname": "/",
+          "search": "",
+          "state": undefined,
+        },
+      ],
+      "go": [Function],
+      "goBack": [Function],
+      "goForward": [Function],
+      "index": 0,
+      "length": 1,
+      "listen": [Function],
+      "location": Object {
+        "hash": "",
+        "key": "cj6ltz",
+        "pathname": "/",
+        "search": "",
+        "state": undefined,
+      },
+      "push": [Function],
+      "replace": [Function],
+    }
+  }
 >
-  <div
-    className="MuiPaper-root-6 MuiPaper-elevation2-10 MuiPaper-rounded-7 FormGroupWrapper-group-3"
-  >
-    <h2
-      className="MuiTypography-root-33 MuiTypography-title-39 FormBranch-title-1"
-    >
-      Form
-    </h2>
-    <div
-      className="MuiFormControl-root-78 MuiFormControl-marginNormal-79 MuiFormControl-fullWidth-81 FormFieldBranch-field-71 FormFieldBranch-widthSmall-74"
-      onKeyPress={[Function]}
-    >
-      <label
-        className="MuiFormLabel-root-93 MuiFormLabel-filled-97 MuiFormLabel-required-98 MuiInputLabel-required-86 MuiInputLabel-root-82 MuiInputLabel-formControl-87 MuiInputLabel-animated-90 MuiInputLabel-shrink-89"
-        data-shrink={true}
-        htmlFor="text"
-      >
-        Text Field
-        <span
-          className="MuiFormLabel-asterisk-99"
-        >
-           *
-        </span>
-      </label>
-      <div
-        className="MuiInputBase-root-113 MuiInput-root-100 MuiInput-underline-104 MuiInputBase-fullWidth-122 MuiInput-fullWidth-107 MuiInputBase-formControl-114 MuiInput-formControl-101 MuiInputBase-adornedEnd-118"
-        onClick={[Function]}
-      >
-        <input
-          aria-invalid={false}
-          className="MuiInputBase-input-123 MuiInput-input-108 MuiInputBase-inputAdornedEnd-129"
-          disabled={false}
-          id="text"
-          onBlur={[Function]}
-          onChange={[Function]}
-          onFocus={[Function]}
-          required={true}
-          rows={1}
-          type="text"
-          value="prefilled text-field"
-        />
-      </div>
-    </div>
-    <div
-      className="MuiFormControl-root-78 MuiFormControl-marginNormal-79 MuiFormControl-fullWidth-81 FormFieldBranch-field-71 FormFieldBranch-widthSmall-74"
-      onKeyPress={[Function]}
-    >
-      <label
-        className="MuiFormLabel-root-93 MuiFormLabel-required-98 MuiInputLabel-required-86 MuiInputLabel-root-82 MuiInputLabel-formControl-87 MuiInputLabel-animated-90"
-        data-shrink={false}
-        htmlFor="select"
-      >
-        Select
-        <span
-          className="MuiFormLabel-asterisk-99"
-        >
-           *
-        </span>
-      </label>
-      <div
-        className="MuiInputBase-root-113 MuiInput-root-100 MuiInput-underline-104 MuiInputBase-fullWidth-122 MuiInput-fullWidth-107 MuiInputBase-formControl-114 MuiInput-formControl-101 MuiInputBase-adornedEnd-118"
-        onClick={[Function]}
-      >
-        <div
-          className="MuiSelect-root-130"
-        >
-          <div
-            aria-haspopup="true"
-            aria-pressed="false"
-            className="MuiSelect-select-131 MuiSelect-selectMenu-134 MuiInputBase-input-123 MuiInput-input-108 MuiInputBase-inputAdornedEnd-129"
-            onBlur={[Function]}
-            onClick={[Function]}
-            onFocus={[Function]}
-            onKeyDown={[Function]}
-            role="button"
-            tabIndex={0}
-          >
-            <span
-              dangerouslySetInnerHTML={
-                Object {
-                  "__html": "&#8203;",
-                }
-              }
-            />
-          </div>
-          <input
-            id="select"
-            rows={1}
-            type="hidden"
-            value=""
-          />
-          <svg
-            aria-hidden="true"
-            className="MuiSvgIcon-root-137 MuiSelect-icon-136"
-            focusable="false"
-            role="presentation"
-            viewBox="0 0 24 24"
-          >
-            <path
-              d="M7 10l5 5 5-5z"
-            />
-          </svg>
-        </div>
-      </div>
-    </div>
-    <div
-      className="MuiFormControl-root-78 MuiFormControl-marginNormal-79 MuiFormControl-fullWidth-81 FormFieldBranch-field-71 FormFieldBranch-widthSmall-74"
-      onKeyPress={[Function]}
-    >
-      <label
-        className="MuiFormLabel-root-93 MuiFormLabel-filled-97 MuiInputLabel-root-82 MuiInputLabel-formControl-87 MuiInputLabel-animated-90 MuiInputLabel-shrink-89"
-        data-shrink={true}
-        htmlFor="number"
-      >
-        Number
-      </label>
-      <div
-        className="MuiInputBase-root-113 MuiInput-root-100 MuiInput-underline-104 MuiInputBase-fullWidth-122 MuiInput-fullWidth-107 MuiInputBase-formControl-114 MuiInput-formControl-101 MuiInputBase-adornedEnd-118"
-        onClick={[Function]}
-      >
-        <input
-          aria-invalid={false}
-          className="MuiInputBase-input-123 MuiInput-input-108 MuiInputBase-inputType-126 MuiInput-inputType-111 MuiInputBase-inputAdornedEnd-129"
-          disabled={false}
-          id="number"
-          onBlur={[Function]}
-          onChange={[Function]}
-          onFocus={[Function]}
-          required={false}
-          rows={1}
-          type="number"
-          value={10}
-        />
-      </div>
-    </div>
-    <div
-      className="MuiFormControl-root-78 MuiFormControl-marginNormal-79 MuiFormControl-fullWidth-81 FormFieldBranch-field-71 FormFieldBranch-widthFull-76"
-      onKeyPress={[Function]}
-    >
-      <label
-        className="MuiFormLabel-root-93 MuiInputLabel-root-82 MuiInputLabel-formControl-87 MuiInputLabel-animated-90"
-        data-shrink={false}
-        htmlFor="multiline"
-      >
-        Multiline
-      </label>
-      <div
-        className="MuiInputBase-root-113 MuiInput-root-100 MuiInput-underline-104 MuiInputBase-fullWidth-122 MuiInput-fullWidth-107 MuiInputBase-formControl-114 MuiInput-formControl-101 MuiInputBase-multiline-121 MuiInput-multiline-106 MuiInputBase-adornedEnd-118"
-        onClick={[Function]}
-      >
-        <textarea
-          aria-invalid={false}
-          className="MuiInputBase-input-123 MuiInput-input-108 MuiInputBase-inputMultiline-125 MuiInput-inputMultiline-110 MuiInputBase-inputAdornedEnd-129"
-          disabled={false}
-          id="multiline"
-          onBlur={[Function]}
-          onChange={[Function]}
-          onFocus={[Function]}
-          required={false}
-          rows={5}
-          value=""
-        />
-      </div>
-    </div>
-    <div
-      className="FormFieldBranch-field-71 FormFieldBranch-widthMid-75 FormFieldListBranch-root-150"
-    >
-      <div
-        className="MuiFormControl-root-78 MuiFormControl-marginNormal-79 MuiFormControl-fullWidth-81"
-        onKeyPress={[Function]}
-      >
-        <label
-          className="MuiFormLabel-root-93 MuiInputLabel-root-82 MuiInputLabel-formControl-87 MuiInputLabel-animated-90"
-          data-shrink={false}
-          htmlFor="list"
-        >
-          List
-        </label>
-        <div
-          className="MuiInputBase-root-113 MuiInput-root-100 MuiInput-underline-104 MuiInputBase-fullWidth-122 MuiInput-fullWidth-107 MuiInputBase-formControl-114 MuiInput-formControl-101 MuiInputBase-adornedEnd-118"
-          onClick={[Function]}
-        >
-          <input
-            aria-invalid={false}
-            className="MuiInputBase-input-123 MuiInput-input-108 MuiInputBase-inputAdornedEnd-129"
-            disabled={false}
-            id="list"
-            onBlur={[Function]}
-            onChange={[Function]}
-            onFocus={[Function]}
-            required={false}
-            rows={1}
-            type="text"
-            value=""
-          />
-        </div>
-      </div>
-      <div
-        className="MuiPaper-root-6 MuiPaper-elevation2-10 MuiPaper-rounded-7 FormFieldListBranch-list-151"
-      >
-        <ul
-          className="MuiList-root-154 MuiList-padding-155"
-        />
-      </div>
-      <div>
-        Array [
-          <div
-            aria-describedby={null}
-            className="MuiChip-root-166 MuiChip-deletable-172 FormFieldListBranch-selectedItem-153"
-            onBlur={[Function]}
-            onFocus={[Function]}
-            onKeyDown={[Function]}
-            onKeyUp={[Function]}
-            onMouseLeave={[Function]}
-            onMouseOver={[Function]}
-            onTouchEnd={[Function]}
-            onTouchStart={[Function]}
-            role="button"
-            tabIndex={0}
-            title="Foo-Baz"
-          >
-            <span
-              className="MuiChip-label-185"
-            >
-              Foo
-            </span>
-            <svg
-              aria-hidden="true"
-              className="MuiSvgIcon-root-137 MuiChip-deleteIcon-186"
-              focusable="false"
-              onClick={[Function]}
-              role="presentation"
-              viewBox="0 0 24 24"
-            >
-              <path
-                d="M12 2C6.47 2 2 6.47 2 12s4.47 10 10 10 10-4.47 10-10S17.53 2 12 2zm5 13.59L15.59 17 12 13.41 8.41 17 7 15.59 10.59 12 7 8.41 8.41 7 12 10.59 15.59 7 17 8.41 13.41 12 17 15.59z"
-              />
-            </svg>
-          </div>,
-          "",
-        ]
-        <div
-          className="MuiChip-root-166 MuiChip-deletable-172 FormFieldListBranch-selectedItem-153"
-          onKeyDown={[Function]}
-          onKeyUp={[Function]}
-          role="button"
-          tabIndex={0}
-        >
-          <span
-            className="MuiChip-label-185"
-          >
-            Bar
-          </span>
-          <svg
-            aria-hidden="true"
-            className="MuiSvgIcon-root-137 MuiChip-deleteIcon-186"
-            focusable="false"
-            onClick={[Function]}
-            role="presentation"
-            viewBox="0 0 24 24"
-          >
-            <path
-              d="M12 2C6.47 2 2 6.47 2 12s4.47 10 10 10 10-4.47 10-10S17.53 2 12 2zm5 13.59L15.59 17 12 13.41 8.41 17 7 15.59 10.59 12 7 8.41 8.41 7 12 10.59 15.59 7 17 8.41 13.41 12 17 15.59z"
-            />
-          </svg>
-        </div>
-        Array [
-          <div
-            aria-describedby={null}
-            className="MuiChip-root-166 MuiChip-deletable-172 FormFieldListBranch-selectedItem-153"
-            onBlur={[Function]}
-            onFocus={[Function]}
-            onKeyDown={[Function]}
-            onKeyUp={[Function]}
-            onMouseLeave={[Function]}
-            onMouseOver={[Function]}
-            onTouchEnd={[Function]}
-            onTouchStart={[Function]}
-            role="button"
-            tabIndex={0}
-            title="Foo-Baz"
-          >
-            <span
-              className="MuiChip-label-185"
-            >
-              Baz
-            </span>
-            <svg
-              aria-hidden="true"
-              className="MuiSvgIcon-root-137 MuiChip-deleteIcon-186"
-              focusable="false"
-              onClick={[Function]}
-              role="presentation"
-              viewBox="0 0 24 24"
-            >
-              <path
-                d="M12 2C6.47 2 2 6.47 2 12s4.47 10 10 10 10-4.47 10-10S17.53 2 12 2zm5 13.59L15.59 17 12 13.41 8.41 17 7 15.59 10.59 12 7 8.41 8.41 7 12 10.59 15.59 7 17 8.41 13.41 12 17 15.59z"
-              />
-            </svg>
-          </div>,
-          "",
-        ]
-      </div>
-    </div>
-    <div
-      className="FormFieldBranch-field-71 FormFieldBranch-widthMid-75 FormFieldListBranch-root-150"
-    >
-      <div
-        className="MuiFormControl-root-78 MuiFormControl-marginNormal-79 MuiFormControl-fullWidth-81"
-        onKeyPress={[Function]}
-      >
-        <label
-          className="MuiFormLabel-root-93 MuiInputLabel-root-82 MuiInputLabel-formControl-87 MuiInputLabel-animated-90"
-          data-shrink={false}
-          htmlFor="free-list"
-        >
-          Free List
-        </label>
-        <div
-          className="MuiInputBase-root-113 MuiInput-root-100 MuiInput-underline-104 MuiInputBase-fullWidth-122 MuiInput-fullWidth-107 MuiInputBase-formControl-114 MuiInput-formControl-101 MuiInputBase-adornedEnd-118"
-          onClick={[Function]}
-        >
-          <input
-            aria-invalid={false}
-            className="MuiInputBase-input-123 MuiInput-input-108 MuiInputBase-inputAdornedEnd-129"
-            disabled={false}
-            id="free-list"
-            onBlur={[Function]}
-            onChange={[Function]}
-            onFocus={[Function]}
-            required={false}
-            rows={1}
-            type="text"
-            value=""
-          />
-        </div>
-      </div>
-      <div
-        className="MuiPaper-root-6 MuiPaper-elevation2-10 MuiPaper-rounded-7 FormFieldListBranch-list-151"
-      >
-        <ul
-          className="MuiList-root-154 MuiList-padding-155"
-        />
-      </div>
-      <div />
-    </div>
-    <div
-      className="FormGroupWrapper-groupIntegrated-4"
-    >
-      <h3
-        className="MuiTypography-root-33 MuiTypography-subheading-40 FormBranch-title-1"
-      >
-        Nested Form
-      </h3>
-      <div
-        className="MuiFormControl-root-78 MuiFormControl-marginNormal-79 MuiFormControl-fullWidth-81 FormFieldBranch-field-71 FormFieldBranch-widthMid-75"
-        onKeyPress={[Function]}
-      >
-        <label
-          className="MuiFormLabel-root-93 MuiInputLabel-root-82 MuiInputLabel-formControl-87 MuiInputLabel-animated-90"
-          data-shrink={false}
-          htmlFor="nested-text"
-        >
-          Nested Text
-        </label>
-        <div
-          className="MuiInputBase-root-113 MuiInput-root-100 MuiInput-underline-104 MuiInputBase-fullWidth-122 MuiInput-fullWidth-107 MuiInputBase-formControl-114 MuiInput-formControl-101 MuiInputBase-adornedEnd-118"
-          onClick={[Function]}
-        >
-          <input
-            aria-invalid={false}
-            className="MuiInputBase-input-123 MuiInput-input-108 MuiInputBase-inputAdornedEnd-129"
-            disabled={false}
-            id="nested-text"
-            onBlur={[Function]}
-            onChange={[Function]}
-            onFocus={[Function]}
-            required={false}
-            rows={1}
-            type="text"
-            value=""
-          />
-          <div
-            className="MuiInputAdornment-root-191 MuiInputAdornment-positionEnd-194"
-          >
-            <svg
-              aria-hidden="true"
-              className="MuiSvgIcon-root-137"
-              focusable="false"
-              role="presentation"
-              viewBox="0 0 24 24"
-            >
-              <path
-                d="M0 0h24v24H0z"
-                fill="none"
-              />
-              <path
-                d="M12 4.5C7 4.5 2.73 7.61 1 12c1.73 4.39 6 7.5 11 7.5s9.27-3.11 11-7.5c-1.73-4.39-6-7.5-11-7.5zM12 17c-2.76 0-5-2.24-5-5s2.24-5 5-5 5 2.24 5 5-2.24 5-5 5zm0-8c-1.66 0-3 1.34-3 3s1.34 3 3 3 3-1.34 3-3-1.34-3-3-3z"
-              />
-            </svg>
-          </div>
-        </div>
-      </div>
-      <div
-        className="FormFieldBranch-field-71 FormFieldBranch-widthMid-75"
-      />
-    </div>
-    <div
-      className="FormFieldBranch-field-71 FormFieldBranch-widthFull-76 FormFieldBranch-field-71"
-    >
-      <h5
-        className="MuiTypography-root-33 MuiTypography-h5-49"
-      >
-        Content
-      </h5>
-      <hr
-        className="MuiDivider-root-196"
-      />
-    </div>
-    <div
-      className="MuiFormControl-root-78 MuiFormControl-marginNormal-79 MuiFormControl-fullWidth-81 FormFieldBranch-field-71 FormFieldBranch-widthMid-75"
-      onKeyPress={[Function]}
-    >
-      <label
-        className="MuiFormLabel-root-93 MuiInputLabel-root-82 MuiInputLabel-formControl-87 MuiInputLabel-animated-90"
-        data-shrink={false}
-        htmlFor="email"
-      >
-        Email
-      </label>
-      <div
-        className="MuiInputBase-root-113 MuiInput-root-100 MuiInput-underline-104 MuiInputBase-fullWidth-122 MuiInput-fullWidth-107 MuiInputBase-formControl-114 MuiInput-formControl-101 MuiInputBase-adornedEnd-118"
-        onClick={[Function]}
-      >
-        <input
-          aria-invalid={false}
-          className="MuiInputBase-input-123 MuiInput-input-108 MuiInputBase-inputType-126 MuiInput-inputType-111 MuiInputBase-inputAdornedEnd-129"
-          disabled={false}
-          id="email"
-          onBlur={[Function]}
-          onChange={[Function]}
-          onFocus={[Function]}
-          required={false}
-          rows={1}
-          type="email"
-          value=""
-        />
-      </div>
-    </div>
-    <div
-      className="MuiFormControl-root-78 MuiFormControl-marginNormal-79 MuiFormControl-fullWidth-81 FormFieldBranch-field-71 FormFieldBranch-widthMid-75"
-      onKeyPress={[Function]}
-    >
-      <label
-        className="MuiFormLabel-root-93 MuiInputLabel-root-82 MuiInputLabel-formControl-87 MuiInputLabel-animated-90"
-        data-shrink={false}
-        htmlFor="password"
-      >
-        Password
-      </label>
-      <div
-        className="MuiInputBase-root-113 MuiInput-root-100 MuiInput-underline-104 MuiInputBase-fullWidth-122 MuiInput-fullWidth-107 MuiInputBase-formControl-114 MuiInput-formControl-101 MuiInputBase-adornedEnd-118"
-        onClick={[Function]}
-      >
-        <input
-          aria-invalid={false}
-          className="MuiInputBase-input-123 MuiInput-input-108 MuiInputBase-inputType-126 MuiInput-inputType-111 MuiInputBase-inputAdornedEnd-129"
-          disabled={false}
-          id="password"
-          onBlur={[Function]}
-          onChange={[Function]}
-          onFocus={[Function]}
-          required={false}
-          rows={1}
-          type="password"
-          value=""
-        />
-      </div>
-    </div>
-    <div
-      className="MuiFormControl-root-78 MuiFormControl-marginNormal-79 MuiFormControl-fullWidth-81 FormFieldBranch-field-71 FormFieldBranch-widthMid-75"
-      onKeyPress={[Function]}
-    >
-      <label
-        className="MuiFormLabel-root-93 MuiInputLabel-root-82 MuiInputLabel-formControl-87 MuiInputLabel-animated-90"
-        data-shrink={false}
-        htmlFor="url"
-      >
-        URL
-      </label>
-      <div
-        className="MuiInputBase-root-113 MuiInput-root-100 MuiInput-underline-104 MuiInputBase-fullWidth-122 MuiInput-fullWidth-107 MuiInputBase-formControl-114 MuiInput-formControl-101 MuiInputBase-adornedEnd-118"
-        onClick={[Function]}
-      >
-        <input
-          aria-describedby="url-helper-text"
-          aria-invalid={false}
-          className="MuiInputBase-input-123 MuiInput-input-108 MuiInputBase-inputType-126 MuiInput-inputType-111 MuiInputBase-inputAdornedEnd-129"
-          disabled={false}
-          id="url"
-          onBlur={[Function]}
-          onChange={[Function]}
-          onFocus={[Function]}
-          required={false}
-          rows={1}
-          type="url"
-          value=""
-        />
-      </div>
-      <p
-        className="MuiFormHelperText-root-201"
-        id="url-helper-text"
-      >
-        Should be URL with trailing slash
-      </p>
-    </div>
-    <div
-      className="MuiFormControl-root-78 MuiFormControl-marginNormal-79 MuiFormControl-fullWidth-81 FormFieldBranch-field-71 FormFieldBranch-widthMid-75"
-      onKeyPress={[Function]}
-    >
-      <div
-        className="MuiInputBase-root-113 MuiInput-root-100 MuiInput-underline-104 MuiInputBase-fullWidth-122 MuiInput-fullWidth-107 MuiInputBase-formControl-114 MuiInput-formControl-101 MuiInputBase-adornedEnd-118"
-        onClick={[Function]}
-      >
-        <input
-          aria-invalid={false}
-          className="MuiInputBase-input-123 MuiInput-input-108 MuiInputBase-inputType-126 MuiInput-inputType-111 MuiInputBase-inputAdornedEnd-129"
-          disabled={false}
-          id="empty"
-          onBlur={[Function]}
-          onChange={[Function]}
-          onFocus={[Function]}
-          required={false}
-          rows={1}
-          type="email"
-          value=""
-        />
-      </div>
-    </div>
-  </div>
-  <div
-    className="MuiPaper-root-6 MuiPaper-elevation2-10 MuiPaper-rounded-7 FormGroupWrapper-group-3"
-  >
-    <h2
-      className="MuiTypography-root-33 MuiTypography-title-39 FormBranch-title-1"
-    >
-      Form - Date
-    </h2>
-    <ForwardRef
-      className="FormFieldBranch-field-71 FormFieldBranch-widthSmall-74 FormFieldBranch-fieldDate-73"
-      clearable={true}
-      format="DD.MM.YYYY"
-      helperText=""
-      id="date"
-      keyboard={true}
-      keyboardIcon={<pure(EventIcon) />}
-      label="Date"
-      leftArrowIcon={<pure(KeyboardArrowLeftIcon) />}
-      onChange={[Function]}
-      required={false}
-      rightArrowIcon={<pure(KeyboardArrowRightIcon) />}
-      value="2018-01-03T14:28:02.669Z"
-    >
-      Array [
-        <div
-          className="MuiFormControl-root-78 FormFieldBranch-field-71 FormFieldBranch-widthSmall-74 FormFieldBranch-fieldDate-73"
-          onClick={[Function]}
-          onKeyPress={[Function]}
-        >
-          <label
-            className="MuiFormLabel-root-93 MuiFormLabel-filled-97 MuiInputLabel-root-82 MuiInputLabel-formControl-87 MuiInputLabel-animated-90 MuiInputLabel-shrink-89"
-            data-shrink={true}
-            htmlFor="date"
-          >
-            Date
-          </label>
-          <div
-            className="MuiInputBase-root-113 MuiInput-root-100 MuiInput-underline-104 MuiInputBase-formControl-114 MuiInput-formControl-101 MuiInputBase-adornedEnd-118"
-            onClick={[Function]}
-          >
-            <input
-              aria-invalid={false}
-              className="MuiInputBase-input-123 MuiInput-input-108 MuiInputBase-inputAdornedEnd-129"
-              disabled={false}
-              id="date"
-              onBlur={[Function]}
-              onChange={[Function]}
-              onFocus={[Function]}
-              readOnly={false}
-              required={false}
-              type="text"
-              value="03.01.2018"
-            />
-            <div
-              className="MuiInputAdornment-root-191 MuiInputAdornment-positionEnd-194"
-            >
-              <button
-                className="MuiButtonBase-root-215 MuiIconButton-root-209"
-                disabled={false}
-                onBlur={[Function]}
-                onClick={[Function]}
-                onContextMenu={[Function]}
-                onFocus={[Function]}
-                onKeyDown={[Function]}
-                onKeyUp={[Function]}
-                onMouseDown={[Function]}
-                onMouseLeave={[Function]}
-                onMouseUp={[Function]}
-                onTouchEnd={[Function]}
-                onTouchMove={[Function]}
-                onTouchStart={[Function]}
-                tabIndex="0"
-                type="button"
-              >
-                <span
-                  className="MuiIconButton-label-214"
-                >
-                  <svg
-                    aria-hidden="true"
-                    className="MuiSvgIcon-root-137"
-                    focusable="false"
-                    role="presentation"
-                    viewBox="0 0 24 24"
-                  >
-                    <path
-                      d="M17 12h-5v5h5v-5zM16 1v2H8V1H6v2H5c-1.11 0-1.99.9-1.99 2L3 19c0 1.1.89 2 2 2h14c1.1 0 2-.9 2-2V5c0-1.1-.9-2-2-2h-1V1h-2zm3 18H5V8h14v11z"
-                    />
-                    <path
-                      d="M0 0h24v24H0z"
-                      fill="none"
-                    />
-                  </svg>
-                </span>
-                <span
-                  className="MuiTouchRipple-root-289"
-                />
-              </button>
-            </div>
-          </div>
-        </div>,
-        "",
-      ]
-    </ForwardRef>
-    <ForwardRef
-      className="FormFieldBranch-field-71 FormFieldBranch-widthSmall-74 FormFieldBranch-fieldDate-73"
-      clearable={true}
-      format="hh:mm a"
-      helperText=""
-      id="time"
-      keyboard={true}
-      keyboardIcon={<pure(EventIcon) />}
-      label="Time"
-      onChange={[Function]}
-      required={false}
-      value="2018-01-03T14:28:02.669Z"
-    >
+  <Form
+    data={
+      Object {
+        "id": Object {
+          "value": "test-id",
+        },
+        "text": Object {
+          "value": "prefilled text-field",
+        },
+      }
+    }
+    form={
       Array [
-        <div
-          className="MuiFormControl-root-78 FormFieldBranch-field-71 FormFieldBranch-widthSmall-74 FormFieldBranch-fieldDate-73"
-          onClick={[Function]}
-          onKeyPress={[Function]}
-        >
-          <label
-            className="MuiFormLabel-root-93 MuiFormLabel-filled-97 MuiInputLabel-root-82 MuiInputLabel-formControl-87 MuiInputLabel-animated-90 MuiInputLabel-shrink-89"
-            data-shrink={true}
-            htmlFor="time"
-          >
-            Time
-          </label>
-          <div
-            className="MuiInputBase-root-113 MuiInput-root-100 MuiInput-underline-104 MuiInputBase-formControl-114 MuiInput-formControl-101 MuiInputBase-adornedEnd-118"
-            onClick={[Function]}
-          >
-            <input
-              aria-invalid={false}
-              className="MuiInputBase-input-123 MuiInput-input-108 MuiInputBase-inputAdornedEnd-129"
-              disabled={false}
-              id="time"
-              onBlur={[Function]}
-              onChange={[Function]}
-              onFocus={[Function]}
-              readOnly={false}
-              required={false}
-              type="text"
-              value="03:28 pm"
-            />
-            <div
-              className="MuiInputAdornment-root-191 MuiInputAdornment-positionEnd-194"
-            >
-              <button
-                className="MuiButtonBase-root-215 MuiIconButton-root-209"
-                disabled={false}
-                onBlur={[Function]}
-                onClick={[Function]}
-                onContextMenu={[Function]}
-                onFocus={[Function]}
-                onKeyDown={[Function]}
-                onKeyUp={[Function]}
-                onMouseDown={[Function]}
-                onMouseLeave={[Function]}
-                onMouseUp={[Function]}
-                onTouchEnd={[Function]}
-                onTouchMove={[Function]}
-                onTouchStart={[Function]}
-                tabIndex="0"
-                type="button"
-              >
-                <span
-                  className="MuiIconButton-label-214"
-                >
-                  <svg
-                    aria-hidden="true"
-                    className="MuiSvgIcon-root-137"
-                    focusable="false"
-                    role="presentation"
-                    viewBox="0 0 24 24"
-                  >
-                    <path
-                      d="M17 12h-5v5h5v-5zM16 1v2H8V1H6v2H5c-1.11 0-1.99.9-1.99 2L3 19c0 1.1.89 2 2 2h14c1.1 0 2-.9 2-2V5c0-1.1-.9-2-2-2h-1V1h-2zm3 18H5V8h14v11z"
-                    />
-                    <path
-                      d="M0 0h24v24H0z"
-                      fill="none"
-                    />
-                  </svg>
-                </span>
-                <span
-                  className="MuiTouchRipple-root-289"
-                />
-              </button>
-            </div>
-          </div>
-        </div>,
-        "",
-      ]
-    </ForwardRef>
-    <ForwardRef
-      className="FormFieldBranch-field-71 FormFieldBranch-widthSmall-74 FormFieldBranch-fieldDate-73"
-      clearable={true}
-      dateRangeIcon={<pure(DateRangeIcon) />}
-      format="DD.MM.YYYY, hh:mm a"
-      helperText=""
-      id="datetime"
-      keyboard={true}
-      keyboardIcon={<pure(EventIcon) />}
-      label="Datetime"
-      leftArrowIcon={<pure(KeyboardArrowLeftIcon) />}
-      onChange={[Function]}
-      required={false}
-      rightArrowIcon={<pure(KeyboardArrowRightIcon) />}
-      timeIcon={<pure(AccessTimeIcon) />}
-      value="2018-01-03T14:28:02.669Z"
-    >
-      Array [
-        <div
-          className="MuiFormControl-root-78 FormFieldBranch-field-71 FormFieldBranch-widthSmall-74 FormFieldBranch-fieldDate-73"
-          onClick={[Function]}
-          onKeyPress={[Function]}
-        >
-          <label
-            className="MuiFormLabel-root-93 MuiFormLabel-filled-97 MuiInputLabel-root-82 MuiInputLabel-formControl-87 MuiInputLabel-animated-90 MuiInputLabel-shrink-89"
-            data-shrink={true}
-            htmlFor="datetime"
-          >
-            Datetime
-          </label>
-          <div
-            className="MuiInputBase-root-113 MuiInput-root-100 MuiInput-underline-104 MuiInputBase-formControl-114 MuiInput-formControl-101 MuiInputBase-adornedEnd-118"
-            onClick={[Function]}
-          >
-            <input
-              aria-invalid={false}
-              className="MuiInputBase-input-123 MuiInput-input-108 MuiInputBase-inputAdornedEnd-129"
-              disabled={false}
-              id="datetime"
-              onBlur={[Function]}
-              onChange={[Function]}
-              onFocus={[Function]}
-              readOnly={false}
-              required={false}
-              type="text"
-              value="03.01.2018, 03:28 pm"
-            />
-            <div
-              className="MuiInputAdornment-root-191 MuiInputAdornment-positionEnd-194"
-            >
-              <button
-                className="MuiButtonBase-root-215 MuiIconButton-root-209"
-                disabled={false}
-                onBlur={[Function]}
-                onClick={[Function]}
-                onContextMenu={[Function]}
-                onFocus={[Function]}
-                onKeyDown={[Function]}
-                onKeyUp={[Function]}
-                onMouseDown={[Function]}
-                onMouseLeave={[Function]}
-                onMouseUp={[Function]}
-                onTouchEnd={[Function]}
-                onTouchMove={[Function]}
-                onTouchStart={[Function]}
-                tabIndex="0"
-                type="button"
-              >
-                <span
-                  className="MuiIconButton-label-214"
+        Object {
+          "data": Array [
+            Object {
+              "id": "text",
+              "isRequired": true,
+              "title": "Text Field",
+              "type": "text",
+              "width": "small",
+            },
+            Object {
+              "id": "select",
+              "isRequired": true,
+              "options": Array [
+                "Foo",
+                "Bar",
+                "Baz",
+              ],
+              "title": "Select",
+              "type": "select",
+              "width": "small",
+            },
+            Object {
+              "id": "number",
+              "title": "Number",
+              "type": "number",
+              "value": 10,
+              "width": "small",
+            },
+            Object {
+              "id": "multiline",
+              "rows": 5,
+              "title": "Multiline",
+              "type": "multiline",
+            },
+            Object {
+              "completeFrom": Array [
+                Object {
+                  "title": "Foo",
+                  "tooltip": "Foo-Baz",
+                },
+                "Bar",
+                Object {
+                  "title": "Baz",
+                  "tooltip": "Foo-Baz",
+                },
+                Object {
+                  "title": "Froot",
+                },
+                Object {
+                  "title": "Foobar",
+                  "tooltip": "Foo-Baz",
+                },
+                Object {
+                  "title": "Barbaz",
+                  "tooltip": "Foo-Baz",
+                },
+                Object {
+                  "title": "Foobaz",
+                },
+              ],
+              "id": "list",
+              "title": "List",
+              "type": "list",
+              "value": Array [
+                "Foo",
+                "Bar",
+                "Baz",
+              ],
+              "width": "mid",
+            },
+            Object {
+              "id": "free-list",
+              "title": "Free List",
+              "type": "list",
+              "width": "mid",
+            },
+            Object {
+              "data": Array [
+                Object {
+                  "iconEnd": <Memo />,
+                  "id": "nested-text",
+                  "title": "Nested Text",
+                  "type": "text",
+                  "width": "mid",
+                },
+                Object {
+                  "id": "empty",
+                  "type": "empty",
+                  "width": "mid",
+                },
+              ],
+              "group": true,
+              "id": "nested",
+              "integrated": true,
+              "isVisible": true,
+              "title": "Nested Form",
+            },
+            Object {
+              "content": <React.Fragment>
+                <ForwardRef(WithStyles)
+                  variant="h5"
                 >
-                  <svg
-                    aria-hidden="true"
-                    className="MuiSvgIcon-root-137"
-                    focusable="false"
-                    role="presentation"
-                    viewBox="0 0 24 24"
-                  >
-                    <path
-                      d="M17 12h-5v5h5v-5zM16 1v2H8V1H6v2H5c-1.11 0-1.99.9-1.99 2L3 19c0 1.1.89 2 2 2h14c1.1 0 2-.9 2-2V5c0-1.1-.9-2-2-2h-1V1h-2zm3 18H5V8h14v11z"
-                    />
-                    <path
-                      d="M0 0h24v24H0z"
-                      fill="none"
-                    />
-                  </svg>
-                </span>
-                <span
-                  className="MuiTouchRipple-root-289"
-                />
-              </button>
-            </div>
-          </div>
-        </div>,
-        "",
-      ]
-    </ForwardRef>
-  </div>
-  <div
-    className="MuiPaper-root-6 MuiPaper-elevation2-10 MuiPaper-rounded-7 FormGroupWrapper-group-3"
-  >
-    <h2
-      className="MuiTypography-root-33 MuiTypography-title-39 FormBranch-title-1"
-    >
-      Form - Disabled fields
-    </h2>
-    <div
-      className="MuiFormControl-root-78 MuiFormControl-marginNormal-79 MuiFormControl-fullWidth-81 FormFieldBranch-field-71 FormFieldBranch-widthMid-75"
-      onKeyPress={[Function]}
-    >
-      <label
-        className="MuiFormLabel-root-93 MuiFormLabel-disabled-95 MuiInputLabel-disabled-84 MuiInputLabel-root-82 MuiInputLabel-formControl-87 MuiInputLabel-animated-90"
-        data-shrink={false}
-        htmlFor="disabled"
-      >
-        Disabled Text
-      </label>
-      <div
-        className="MuiInputBase-root-113 MuiInput-root-100 MuiInput-underline-104 MuiInputBase-disabled-116 MuiInput-disabled-103 MuiInputBase-fullWidth-122 MuiInput-fullWidth-107 MuiInputBase-formControl-114 MuiInput-formControl-101 MuiInputBase-adornedEnd-118"
-        onClick={[Function]}
-      >
-        <input
-          aria-invalid={false}
-          className="MuiInputBase-input-123 MuiInput-input-108 MuiInputBase-disabled-116 MuiInput-disabled-103 MuiInputBase-inputAdornedEnd-129"
-          disabled={true}
-          id="disabled"
-          onBlur={[Function]}
-          onChange={[Function]}
-          onFocus={[Function]}
-          required={false}
-          rows={1}
-          type="text"
-          value=""
-        />
-      </div>
-    </div>
-    <div
-      className="MuiFormControl-root-78 MuiFormControl-marginNormal-79 MuiFormControl-fullWidth-81 FormFieldBranch-field-71 FormFieldBranch-widthMid-75"
-      onKeyPress={[Function]}
-    >
-      <label
-        className="MuiFormLabel-root-93 MuiFormLabel-disabled-95 MuiInputLabel-disabled-84 MuiInputLabel-root-82 MuiInputLabel-formControl-87 MuiInputLabel-animated-90"
-        data-shrink={false}
-        htmlFor="disabled-select"
-      >
-        Disabled Select
-      </label>
-      <div
-        className="MuiInputBase-root-113 MuiInput-root-100 MuiInput-underline-104 MuiInputBase-disabled-116 MuiInput-disabled-103 MuiInputBase-fullWidth-122 MuiInput-fullWidth-107 MuiInputBase-formControl-114 MuiInput-formControl-101 MuiInputBase-adornedEnd-118"
-        onClick={[Function]}
-      >
-        <div
-          className="MuiSelect-root-130"
-        >
-          <div
-            aria-haspopup="true"
-            aria-pressed="false"
-            className="MuiSelect-select-131 MuiSelect-selectMenu-134 MuiSelect-disabled-135 MuiInputBase-input-123 MuiInput-input-108 MuiInputBase-disabled-116 MuiInput-disabled-103 MuiInputBase-inputAdornedEnd-129"
-            onBlur={[Function]}
-            onClick={null}
-            onFocus={[Function]}
-            onKeyDown={[Function]}
-            role="button"
-            tabIndex={null}
-          >
-            <span
-              dangerouslySetInnerHTML={
+                  Content
+                </ForwardRef(WithStyles)>
+                <ForwardRef(WithStyles) />
+              </React.Fragment>,
+              "id": "content",
+              "type": "content",
+            },
+            Object {
+              "beforeSubmit": [Function],
+              "id": "email",
+              "title": "Email",
+              "type": "email",
+              "width": "mid",
+            },
+            Object {
+              "id": "password",
+              "title": "Password",
+              "type": "password",
+              "width": "mid",
+            },
+            Object {
+              "helperText": "Should be URL with trailing slash",
+              "id": "url",
+              "title": "URL",
+              "type": "url",
+              "validators": Array [
                 Object {
-                  "__html": "&#8203;",
-                }
-              }
-            />
-          </div>
-          <input
-            id="disabled-select"
-            rows={1}
-            type="hidden"
-            value=""
-          />
-          <svg
-            aria-hidden="true"
-            className="MuiSvgIcon-root-137 MuiSelect-icon-136"
-            focusable="false"
-            role="presentation"
-            viewBox="0 0 24 24"
-          >
-            <path
-              d="M7 10l5 5 5-5z"
-            />
-          </svg>
-        </div>
-      </div>
-    </div>
-  </div>
-  <div
-    className="MuiPaper-root-6 MuiPaper-elevation2-10 MuiPaper-rounded-7 FormGroupWrapper-group-3"
-  >
-    <h2
-      className="MuiTypography-root-33 MuiTypography-title-39 FormBranch-title-1"
-    >
-      Form - Switches, Radio Buttons and Checkboxes
-    </h2>
-    <div
-      className="FormFieldBranch-field-71 FormFieldBranch-widthSmall-74 FormFieldBranch-fieldInline-72"
-    >
-      <label
-        className="MuiFormControlLabel-root-240"
-      >
-        <span
-          className="MuiSwitch-root-246"
-        >
-          <span
-            className="MuiButtonBase-root-215 MuiIconButton-root-209 MuiPrivateSwitchBase-root-255 MuiSwitch-switchBase-249 MuiSwitch-colorPrimary-251"
-            onBlur={[Function]}
-            onContextMenu={[Function]}
-            onFocus={[Function]}
-            onKeyDown={[Function]}
-            onKeyUp={[Function]}
-            onMouseDown={[Function]}
-            onMouseLeave={[Function]}
-            onMouseUp={[Function]}
-            onTouchEnd={[Function]}
-            onTouchMove={[Function]}
-            onTouchStart={[Function]}
-            tabIndex={null}
-          >
-            <span
-              className="MuiIconButton-label-214"
-            >
-              <span
-                className="MuiSwitch-icon-247"
-              />
-              <input
-                checked={false}
-                className="MuiPrivateSwitchBase-input-258"
-                disabled={false}
-                onChange={[Function]}
-                type="checkbox"
-                value="switch"
-              />
-            </span>
-            <span
-              className="MuiTouchRipple-root-289"
-            />
-          </span>
-          <span
-            className="MuiSwitch-bar-254"
-          />
-        </span>
-        <span
-          className="MuiTypography-root-33 MuiTypography-body1-42 MuiFormControlLabel-label-245"
-        >
-          Switch
-        </span>
-      </label>
-      <p
-        className="MuiFormHelperText-root-201"
-      >
-        Display Helper Text
-      </p>
-    </div>
-    <div
-      className="FormFieldBranch-field-71 FormFieldBranch-widthSmall-74 FormFieldBranch-fieldInline-72"
-    >
-      <label
-        className="MuiFormControlLabel-root-240 MuiFormControlLabel-disabled-244"
-      >
-        <span
-          className="MuiSwitch-root-246"
-        >
-          <span
-            className="MuiButtonBase-root-215 MuiButtonBase-disabled-216 MuiIconButton-root-209 MuiIconButton-disabled-213 MuiPrivateSwitchBase-root-255 MuiSwitch-switchBase-249 MuiSwitch-colorPrimary-251 MuiPrivateSwitchBase-disabled-257 MuiSwitch-disabled-253"
-            onBlur={[Function]}
-            onContextMenu={[Function]}
-            onFocus={[Function]}
-            onKeyDown={[Function]}
-            onKeyUp={[Function]}
-            onMouseDown={[Function]}
-            onMouseLeave={[Function]}
-            onMouseUp={[Function]}
-            onTouchEnd={[Function]}
-            onTouchMove={[Function]}
-            onTouchStart={[Function]}
-            tabIndex="-1"
-          >
-            <span
-              className="MuiIconButton-label-214"
-            >
-              <span
-                className="MuiSwitch-icon-247"
-              />
-              <input
-                checked={false}
-                className="MuiPrivateSwitchBase-input-258"
-                disabled={true}
-                onChange={[Function]}
-                type="checkbox"
-                value="switch-1"
-              />
-            </span>
-          </span>
-          <span
-            className="MuiSwitch-bar-254"
-          />
-        </span>
-        <span
-          className="MuiTypography-root-33 MuiTypography-body1-42 MuiFormControlLabel-label-245 MuiFormControlLabel-disabled-244"
-        >
-          Switch - Disabled
-        </span>
-      </label>
-      <p
-        className="MuiFormHelperText-root-201 MuiFormHelperText-disabled-203"
-      >
-        Display Helper Text
-      </p>
-    </div>
-  </div>
-  <div
-    className="FormSubmitButton-root-259"
-  >
-    <button
-      className="MuiButtonBase-root-215 MuiButton-root-263 MuiButton-contained-274 MuiButton-containedSecondary-276 MuiButton-raised-277 MuiButton-raisedSecondary-279 FormSubmitButton-button-261"
-      disabled={false}
-      onBlur={[Function]}
-      onClick={[Function]}
-      onContextMenu={[Function]}
-      onFocus={[Function]}
-      onKeyDown={[Function]}
-      onKeyUp={[Function]}
-      onMouseDown={[Function]}
-      onMouseLeave={[Function]}
-      onMouseUp={[Function]}
-      onTouchEnd={[Function]}
-      onTouchMove={[Function]}
-      onTouchStart={[Function]}
-      tabIndex="0"
-      type="button"
-    >
-      <span
-        className="MuiButton-label-264"
-      >
-        Save
-      </span>
-      <span
-        className="MuiTouchRipple-root-289"
-      />
-    </button>
-  </div>
-</form>
+                  "message": "Please add a trailing slash to your URL",
+                  "validator": [Function],
+                },
+              ],
+              "width": "mid",
+            },
+            Object {
+              "id": "empty",
+              "type": "email",
+              "width": "mid",
+            },
+          ],
+          "group": true,
+          "id": "base",
+          "title": "Form",
+        },
+        Object {
+          "data": Array [
+            Object {
+              "format": "DD.MM.YYYY",
+              "id": "date",
+              "title": "Date",
+              "type": "date",
+              "validators": Array [
+                "date",
+              ],
+              "value": 1514989682669,
+              "width": "small",
+            },
+            Object {
+              "format": "hh:mm a",
+              "id": "time",
+              "title": "Time",
+              "type": "time",
+              "validators": Array [
+                "date",
+              ],
+              "value": 1514989682669,
+              "width": "small",
+            },
+            Object {
+              "format": "DD.MM.YYYY, hh:mm a",
+              "id": "datetime",
+              "title": "Datetime",
+              "type": "datetime",
+              "validators": Array [
+                "date",
+              ],
+              "value": 1514989682669,
+              "width": "small",
+            },
+          ],
+          "group": true,
+          "id": "date",
+          "title": "Form - Date",
+        },
+        Object {
+          "data": Array [
+            Object {
+              "id": "disabled",
+              "isDisabled": true,
+              "title": "Disabled Text",
+              "type": "text",
+              "width": "mid",
+            },
+            Object {
+              "id": "disabled-select",
+              "isDisabled": true,
+              "options": Array [
+                "Foo",
+                "Bar",
+                "Baz",
+              ],
+              "title": "Disabled Select",
+              "type": "select",
+              "width": "mid",
+            },
+          ],
+          "group": true,
+          "id": "disabled",
+          "title": "Form - Disabled fields",
+        },
+        Object {
+          "data": Array [
+            Object {
+              "helperText": "Display Helper Text",
+              "id": "switch",
+              "title": "Switch",
+              "type": "switch",
+              "width": "small",
+            },
+            Object {
+              "helperText": "Display Helper Text",
+              "id": "switch-1",
+              "isDisabled": true,
+              "title": "Switch - Disabled",
+              "type": "switch",
+              "width": "small",
+            },
+          ],
+          "group": true,
+          "id": "switches",
+          "title": "Form - Switches, Radio Buttons and Checkboxes",
+        },
+      ]
+    }
+    isFixedSubmitButton={false}
+    onDataChanged={[Function]}
+    onSubmit={[Function]}
+    submitText="Save"
+  />
+</Router>
 `;
 
 exports[`renders correctly with content 1`] = `
-<form
-  autoComplete="off"
-  noValidate={true}
+<Router
+  history={
+    Object {
+      "action": "POP",
+      "block": [Function],
+      "canGo": [Function],
+      "createHref": [Function],
+      "entries": Array [
+        Object {
+          "hash": "",
+          "key": "2z6i33",
+          "pathname": "/",
+          "search": "",
+          "state": undefined,
+        },
+      ],
+      "go": [Function],
+      "goBack": [Function],
+      "goForward": [Function],
+      "index": 0,
+      "length": 1,
+      "listen": [Function],
+      "location": Object {
+        "hash": "",
+        "key": "2z6i33",
+        "pathname": "/",
+        "search": "",
+        "state": undefined,
+      },
+      "push": [Function],
+      "replace": [Function],
+    }
+  }
 >
-  <div
-    className="MuiPaper-root-6 MuiPaper-elevation2-10 MuiPaper-rounded-7 FormGroupWrapper-group-3"
-  >
-    <h2
-      className="MuiTypography-root-33 MuiTypography-title-39 FormBranch-title-1"
-    >
-      Form
-    </h2>
-    <div
-      className="MuiFormControl-root-78 MuiFormControl-marginNormal-79 MuiFormControl-fullWidth-81 FormFieldBranch-field-71 FormFieldBranch-widthSmall-74"
-      onKeyPress={[Function]}
-    >
-      <label
-        className="MuiFormLabel-root-93 MuiFormLabel-filled-97 MuiFormLabel-required-98 MuiInputLabel-required-86 MuiInputLabel-root-82 MuiInputLabel-formControl-87 MuiInputLabel-animated-90 MuiInputLabel-shrink-89"
-        data-shrink={true}
-        htmlFor="text"
-      >
-        Text Field
-        <span
-          className="MuiFormLabel-asterisk-99"
-        >
-           *
-        </span>
-      </label>
-      <div
-        className="MuiInputBase-root-113 MuiInput-root-100 MuiInput-underline-104 MuiInputBase-fullWidth-122 MuiInput-fullWidth-107 MuiInputBase-formControl-114 MuiInput-formControl-101 MuiInputBase-adornedEnd-118"
-        onClick={[Function]}
-      >
-        <input
-          aria-invalid={false}
-          className="MuiInputBase-input-123 MuiInput-input-108 MuiInputBase-inputAdornedEnd-129"
-          disabled={false}
-          id="text"
-          onBlur={[Function]}
-          onChange={[Function]}
-          onFocus={[Function]}
-          required={true}
-          rows={1}
-          type="text"
-          value="prefilled text-field"
-        />
-      </div>
-    </div>
-    <div
-      className="MuiFormControl-root-78 MuiFormControl-marginNormal-79 MuiFormControl-fullWidth-81 FormFieldBranch-field-71 FormFieldBranch-widthSmall-74"
-      onKeyPress={[Function]}
-    >
-      <label
-        className="MuiFormLabel-root-93 MuiFormLabel-required-98 MuiInputLabel-required-86 MuiInputLabel-root-82 MuiInputLabel-formControl-87 MuiInputLabel-animated-90"
-        data-shrink={false}
-        htmlFor="select"
-      >
-        Select
-        <span
-          className="MuiFormLabel-asterisk-99"
-        >
-           *
-        </span>
-      </label>
-      <div
-        className="MuiInputBase-root-113 MuiInput-root-100 MuiInput-underline-104 MuiInputBase-fullWidth-122 MuiInput-fullWidth-107 MuiInputBase-formControl-114 MuiInput-formControl-101 MuiInputBase-adornedEnd-118"
-        onClick={[Function]}
-      >
-        <div
-          className="MuiSelect-root-130"
-        >
-          <div
-            aria-haspopup="true"
-            aria-pressed="false"
-            className="MuiSelect-select-131 MuiSelect-selectMenu-134 MuiInputBase-input-123 MuiInput-input-108 MuiInputBase-inputAdornedEnd-129"
-            onBlur={[Function]}
-            onClick={[Function]}
-            onFocus={[Function]}
-            onKeyDown={[Function]}
-            role="button"
-            tabIndex={0}
-          >
-            <span
-              dangerouslySetInnerHTML={
-                Object {
-                  "__html": "&#8203;",
-                }
-              }
-            />
-          </div>
-          <input
-            id="select"
-            rows={1}
-            type="hidden"
-            value=""
-          />
-          <svg
-            aria-hidden="true"
-            className="MuiSvgIcon-root-137 MuiSelect-icon-136"
-            focusable="false"
-            role="presentation"
-            viewBox="0 0 24 24"
-          >
-            <path
-              d="M7 10l5 5 5-5z"
-            />
-          </svg>
-        </div>
-      </div>
-    </div>
-    <div
-      className="MuiFormControl-root-78 MuiFormControl-marginNormal-79 MuiFormControl-fullWidth-81 FormFieldBranch-field-71 FormFieldBranch-widthSmall-74"
-      onKeyPress={[Function]}
-    >
-      <label
-        className="MuiFormLabel-root-93 MuiFormLabel-filled-97 MuiInputLabel-root-82 MuiInputLabel-formControl-87 MuiInputLabel-animated-90 MuiInputLabel-shrink-89"
-        data-shrink={true}
-        htmlFor="number"
-      >
-        Number
-      </label>
-      <div
-        className="MuiInputBase-root-113 MuiInput-root-100 MuiInput-underline-104 MuiInputBase-fullWidth-122 MuiInput-fullWidth-107 MuiInputBase-formControl-114 MuiInput-formControl-101 MuiInputBase-adornedEnd-118"
-        onClick={[Function]}
-      >
-        <input
-          aria-invalid={false}
-          className="MuiInputBase-input-123 MuiInput-input-108 MuiInputBase-inputType-126 MuiInput-inputType-111 MuiInputBase-inputAdornedEnd-129"
-          disabled={false}
-          id="number"
-          onBlur={[Function]}
-          onChange={[Function]}
-          onFocus={[Function]}
-          required={false}
-          rows={1}
-          type="number"
-          value={10}
-        />
-      </div>
-    </div>
-    <div
-      className="MuiFormControl-root-78 MuiFormControl-marginNormal-79 MuiFormControl-fullWidth-81 FormFieldBranch-field-71 FormFieldBranch-widthFull-76"
-      onKeyPress={[Function]}
-    >
-      <label
-        className="MuiFormLabel-root-93 MuiInputLabel-root-82 MuiInputLabel-formControl-87 MuiInputLabel-animated-90"
-        data-shrink={false}
-        htmlFor="multiline"
-      >
-        Multiline
-      </label>
-      <div
-        className="MuiInputBase-root-113 MuiInput-root-100 MuiInput-underline-104 MuiInputBase-fullWidth-122 MuiInput-fullWidth-107 MuiInputBase-formControl-114 MuiInput-formControl-101 MuiInputBase-multiline-121 MuiInput-multiline-106 MuiInputBase-adornedEnd-118"
-        onClick={[Function]}
-      >
-        <textarea
-          aria-invalid={false}
-          className="MuiInputBase-input-123 MuiInput-input-108 MuiInputBase-inputMultiline-125 MuiInput-inputMultiline-110 MuiInputBase-inputAdornedEnd-129"
-          disabled={false}
-          id="multiline"
-          onBlur={[Function]}
-          onChange={[Function]}
-          onFocus={[Function]}
-          required={false}
-          rows={5}
-          value=""
-        />
-      </div>
-    </div>
-    <div
-      className="FormFieldBranch-field-71 FormFieldBranch-widthMid-75 FormFieldListBranch-root-150"
-    >
-      <div
-        className="MuiFormControl-root-78 MuiFormControl-marginNormal-79 MuiFormControl-fullWidth-81"
-        onKeyPress={[Function]}
-      >
-        <label
-          className="MuiFormLabel-root-93 MuiInputLabel-root-82 MuiInputLabel-formControl-87 MuiInputLabel-animated-90"
-          data-shrink={false}
-          htmlFor="list"
-        >
-          List
-        </label>
-        <div
-          className="MuiInputBase-root-113 MuiInput-root-100 MuiInput-underline-104 MuiInputBase-fullWidth-122 MuiInput-fullWidth-107 MuiInputBase-formControl-114 MuiInput-formControl-101 MuiInputBase-adornedEnd-118"
-          onClick={[Function]}
-        >
-          <input
-            aria-invalid={false}
-            className="MuiInputBase-input-123 MuiInput-input-108 MuiInputBase-inputAdornedEnd-129"
-            disabled={false}
-            id="list"
-            onBlur={[Function]}
-            onChange={[Function]}
-            onFocus={[Function]}
-            required={false}
-            rows={1}
-            type="text"
-            value=""
-          />
-        </div>
-      </div>
-      <div
-        className="MuiPaper-root-6 MuiPaper-elevation2-10 MuiPaper-rounded-7 FormFieldListBranch-list-151"
-      >
-        <ul
-          className="MuiList-root-154 MuiList-padding-155"
-        />
-      </div>
-      <div>
-        Array [
-          <div
-            aria-describedby={null}
-            className="MuiChip-root-166 MuiChip-deletable-172 FormFieldListBranch-selectedItem-153"
-            onBlur={[Function]}
-            onFocus={[Function]}
-            onKeyDown={[Function]}
-            onKeyUp={[Function]}
-            onMouseLeave={[Function]}
-            onMouseOver={[Function]}
-            onTouchEnd={[Function]}
-            onTouchStart={[Function]}
-            role="button"
-            tabIndex={0}
-            title="Foo-Baz"
-          >
-            <span
-              className="MuiChip-label-185"
-            >
-              Foo
-            </span>
-            <svg
-              aria-hidden="true"
-              className="MuiSvgIcon-root-137 MuiChip-deleteIcon-186"
-              focusable="false"
-              onClick={[Function]}
-              role="presentation"
-              viewBox="0 0 24 24"
-            >
-              <path
-                d="M12 2C6.47 2 2 6.47 2 12s4.47 10 10 10 10-4.47 10-10S17.53 2 12 2zm5 13.59L15.59 17 12 13.41 8.41 17 7 15.59 10.59 12 7 8.41 8.41 7 12 10.59 15.59 7 17 8.41 13.41 12 17 15.59z"
-              />
-            </svg>
-          </div>,
-          "",
-        ]
-        <div
-          className="MuiChip-root-166 MuiChip-deletable-172 FormFieldListBranch-selectedItem-153"
-          onKeyDown={[Function]}
-          onKeyUp={[Function]}
-          role="button"
-          tabIndex={0}
-        >
-          <span
-            className="MuiChip-label-185"
-          >
-            Bar
-          </span>
-          <svg
-            aria-hidden="true"
-            className="MuiSvgIcon-root-137 MuiChip-deleteIcon-186"
-            focusable="false"
-            onClick={[Function]}
-            role="presentation"
-            viewBox="0 0 24 24"
-          >
-            <path
-              d="M12 2C6.47 2 2 6.47 2 12s4.47 10 10 10 10-4.47 10-10S17.53 2 12 2zm5 13.59L15.59 17 12 13.41 8.41 17 7 15.59 10.59 12 7 8.41 8.41 7 12 10.59 15.59 7 17 8.41 13.41 12 17 15.59z"
-            />
-          </svg>
-        </div>
-        Array [
-          <div
-            aria-describedby={null}
-            className="MuiChip-root-166 MuiChip-deletable-172 FormFieldListBranch-selectedItem-153"
-            onBlur={[Function]}
-            onFocus={[Function]}
-            onKeyDown={[Function]}
-            onKeyUp={[Function]}
-            onMouseLeave={[Function]}
-            onMouseOver={[Function]}
-            onTouchEnd={[Function]}
-            onTouchStart={[Function]}
-            role="button"
-            tabIndex={0}
-            title="Foo-Baz"
-          >
-            <span
-              className="MuiChip-label-185"
-            >
-              Baz
-            </span>
-            <svg
-              aria-hidden="true"
-              className="MuiSvgIcon-root-137 MuiChip-deleteIcon-186"
-              focusable="false"
-              onClick={[Function]}
-              role="presentation"
-              viewBox="0 0 24 24"
-            >
-              <path
-                d="M12 2C6.47 2 2 6.47 2 12s4.47 10 10 10 10-4.47 10-10S17.53 2 12 2zm5 13.59L15.59 17 12 13.41 8.41 17 7 15.59 10.59 12 7 8.41 8.41 7 12 10.59 15.59 7 17 8.41 13.41 12 17 15.59z"
-              />
-            </svg>
-          </div>,
-          "",
-        ]
-      </div>
-    </div>
-    <div
-      className="FormFieldBranch-field-71 FormFieldBranch-widthMid-75 FormFieldListBranch-root-150"
-    >
-      <div
-        className="MuiFormControl-root-78 MuiFormControl-marginNormal-79 MuiFormControl-fullWidth-81"
-        onKeyPress={[Function]}
-      >
-        <label
-          className="MuiFormLabel-root-93 MuiInputLabel-root-82 MuiInputLabel-formControl-87 MuiInputLabel-animated-90"
-          data-shrink={false}
-          htmlFor="free-list"
-        >
-          Free List
-        </label>
-        <div
-          className="MuiInputBase-root-113 MuiInput-root-100 MuiInput-underline-104 MuiInputBase-fullWidth-122 MuiInput-fullWidth-107 MuiInputBase-formControl-114 MuiInput-formControl-101 MuiInputBase-adornedEnd-118"
-          onClick={[Function]}
-        >
-          <input
-            aria-invalid={false}
-            className="MuiInputBase-input-123 MuiInput-input-108 MuiInputBase-inputAdornedEnd-129"
-            disabled={false}
-            id="free-list"
-            onBlur={[Function]}
-            onChange={[Function]}
-            onFocus={[Function]}
-            required={false}
-            rows={1}
-            type="text"
-            value=""
-          />
-        </div>
-      </div>
-      <div
-        className="MuiPaper-root-6 MuiPaper-elevation2-10 MuiPaper-rounded-7 FormFieldListBranch-list-151"
-      >
-        <ul
-          className="MuiList-root-154 MuiList-padding-155"
-        />
-      </div>
-      <div />
-    </div>
-    <div
-      className="FormGroupWrapper-groupIntegrated-4"
-    >
-      <h3
-        className="MuiTypography-root-33 MuiTypography-subheading-40 FormBranch-title-1"
-      >
-        Nested Form
-      </h3>
-      <div
-        className="MuiFormControl-root-78 MuiFormControl-marginNormal-79 MuiFormControl-fullWidth-81 FormFieldBranch-field-71 FormFieldBranch-widthMid-75"
-        onKeyPress={[Function]}
-      >
-        <label
-          className="MuiFormLabel-root-93 MuiInputLabel-root-82 MuiInputLabel-formControl-87 MuiInputLabel-animated-90"
-          data-shrink={false}
-          htmlFor="nested-text"
-        >
-          Nested Text
-        </label>
-        <div
-          className="MuiInputBase-root-113 MuiInput-root-100 MuiInput-underline-104 MuiInputBase-fullWidth-122 MuiInput-fullWidth-107 MuiInputBase-formControl-114 MuiInput-formControl-101 MuiInputBase-adornedEnd-118"
-          onClick={[Function]}
-        >
-          <input
-            aria-invalid={false}
-            className="MuiInputBase-input-123 MuiInput-input-108 MuiInputBase-inputAdornedEnd-129"
-            disabled={false}
-            id="nested-text"
-            onBlur={[Function]}
-            onChange={[Function]}
-            onFocus={[Function]}
-            required={false}
-            rows={1}
-            type="text"
-            value=""
-          />
-          <div
-            className="MuiInputAdornment-root-191 MuiInputAdornment-positionEnd-194"
-          >
-            <svg
-              aria-hidden="true"
-              className="MuiSvgIcon-root-137"
-              focusable="false"
-              role="presentation"
-              viewBox="0 0 24 24"
-            >
-              <path
-                d="M0 0h24v24H0z"
-                fill="none"
-              />
-              <path
-                d="M12 4.5C7 4.5 2.73 7.61 1 12c1.73 4.39 6 7.5 11 7.5s9.27-3.11 11-7.5c-1.73-4.39-6-7.5-11-7.5zM12 17c-2.76 0-5-2.24-5-5s2.24-5 5-5 5 2.24 5 5-2.24 5-5 5zm0-8c-1.66 0-3 1.34-3 3s1.34 3 3 3 3-1.34 3-3-1.34-3-3-3z"
-              />
-            </svg>
-          </div>
-        </div>
-      </div>
-      <div
-        className="FormFieldBranch-field-71 FormFieldBranch-widthMid-75"
-      />
-    </div>
-    <div
-      className="FormFieldBranch-field-71 FormFieldBranch-widthFull-76 FormFieldBranch-field-71"
-    >
-      <h5
-        className="MuiTypography-root-33 MuiTypography-h5-49"
-      >
-        Content
-      </h5>
-      <hr
-        className="MuiDivider-root-196"
-      />
-    </div>
-    <div
-      className="MuiFormControl-root-78 MuiFormControl-marginNormal-79 MuiFormControl-fullWidth-81 FormFieldBranch-field-71 FormFieldBranch-widthMid-75"
-      onKeyPress={[Function]}
-    >
-      <label
-        className="MuiFormLabel-root-93 MuiInputLabel-root-82 MuiInputLabel-formControl-87 MuiInputLabel-animated-90"
-        data-shrink={false}
-        htmlFor="email"
-      >
-        Email
-      </label>
-      <div
-        className="MuiInputBase-root-113 MuiInput-root-100 MuiInput-underline-104 MuiInputBase-fullWidth-122 MuiInput-fullWidth-107 MuiInputBase-formControl-114 MuiInput-formControl-101 MuiInputBase-adornedEnd-118"
-        onClick={[Function]}
-      >
-        <input
-          aria-invalid={false}
-          className="MuiInputBase-input-123 MuiInput-input-108 MuiInputBase-inputType-126 MuiInput-inputType-111 MuiInputBase-inputAdornedEnd-129"
-          disabled={false}
-          id="email"
-          onBlur={[Function]}
-          onChange={[Function]}
-          onFocus={[Function]}
-          required={false}
-          rows={1}
-          type="email"
-          value=""
-        />
-      </div>
-    </div>
-    <div
-      className="MuiFormControl-root-78 MuiFormControl-marginNormal-79 MuiFormControl-fullWidth-81 FormFieldBranch-field-71 FormFieldBranch-widthMid-75"
-      onKeyPress={[Function]}
-    >
-      <label
-        className="MuiFormLabel-root-93 MuiInputLabel-root-82 MuiInputLabel-formControl-87 MuiInputLabel-animated-90"
-        data-shrink={false}
-        htmlFor="password"
-      >
-        Password
-      </label>
-      <div
-        className="MuiInputBase-root-113 MuiInput-root-100 MuiInput-underline-104 MuiInputBase-fullWidth-122 MuiInput-fullWidth-107 MuiInputBase-formControl-114 MuiInput-formControl-101 MuiInputBase-adornedEnd-118"
-        onClick={[Function]}
-      >
-        <input
-          aria-invalid={false}
-          className="MuiInputBase-input-123 MuiInput-input-108 MuiInputBase-inputType-126 MuiInput-inputType-111 MuiInputBase-inputAdornedEnd-129"
-          disabled={false}
-          id="password"
-          onBlur={[Function]}
-          onChange={[Function]}
-          onFocus={[Function]}
-          required={false}
-          rows={1}
-          type="password"
-          value=""
-        />
-      </div>
-    </div>
-    <div
-      className="MuiFormControl-root-78 MuiFormControl-marginNormal-79 MuiFormControl-fullWidth-81 FormFieldBranch-field-71 FormFieldBranch-widthMid-75"
-      onKeyPress={[Function]}
-    >
-      <label
-        className="MuiFormLabel-root-93 MuiInputLabel-root-82 MuiInputLabel-formControl-87 MuiInputLabel-animated-90"
-        data-shrink={false}
-        htmlFor="url"
-      >
-        URL
-      </label>
-      <div
-        className="MuiInputBase-root-113 MuiInput-root-100 MuiInput-underline-104 MuiInputBase-fullWidth-122 MuiInput-fullWidth-107 MuiInputBase-formControl-114 MuiInput-formControl-101 MuiInputBase-adornedEnd-118"
-        onClick={[Function]}
-      >
-        <input
-          aria-describedby="url-helper-text"
-          aria-invalid={false}
-          className="MuiInputBase-input-123 MuiInput-input-108 MuiInputBase-inputType-126 MuiInput-inputType-111 MuiInputBase-inputAdornedEnd-129"
-          disabled={false}
-          id="url"
-          onBlur={[Function]}
-          onChange={[Function]}
-          onFocus={[Function]}
-          required={false}
-          rows={1}
-          type="url"
-          value=""
-        />
-      </div>
-      <p
-        className="MuiFormHelperText-root-201"
-        id="url-helper-text"
-      >
-        Should be URL with trailing slash
-      </p>
-    </div>
-    <div
-      className="MuiFormControl-root-78 MuiFormControl-marginNormal-79 MuiFormControl-fullWidth-81 FormFieldBranch-field-71 FormFieldBranch-widthMid-75"
-      onKeyPress={[Function]}
-    >
-      <div
-        className="MuiInputBase-root-113 MuiInput-root-100 MuiInput-underline-104 MuiInputBase-fullWidth-122 MuiInput-fullWidth-107 MuiInputBase-formControl-114 MuiInput-formControl-101 MuiInputBase-adornedEnd-118"
-        onClick={[Function]}
-      >
-        <input
-          aria-invalid={false}
-          className="MuiInputBase-input-123 MuiInput-input-108 MuiInputBase-inputType-126 MuiInput-inputType-111 MuiInputBase-inputAdornedEnd-129"
-          disabled={false}
-          id="empty"
-          onBlur={[Function]}
-          onChange={[Function]}
-          onFocus={[Function]}
-          required={false}
-          rows={1}
-          type="email"
-          value=""
-        />
-      </div>
-    </div>
-  </div>
-  <div
-    className="MuiPaper-root-6 MuiPaper-elevation2-10 MuiPaper-rounded-7 FormGroupWrapper-group-3"
-  >
-    <h2
-      className="MuiTypography-root-33 MuiTypography-title-39 FormBranch-title-1"
-    >
-      Form - Date
-    </h2>
-    <ForwardRef
-      className="FormFieldBranch-field-71 FormFieldBranch-widthSmall-74 FormFieldBranch-fieldDate-73"
-      clearable={true}
-      format="DD.MM.YYYY"
-      helperText=""
-      id="date"
-      keyboard={true}
-      keyboardIcon={<pure(EventIcon) />}
-      label="Date"
-      leftArrowIcon={<pure(KeyboardArrowLeftIcon) />}
-      onChange={[Function]}
-      required={false}
-      rightArrowIcon={<pure(KeyboardArrowRightIcon) />}
-      value="2018-01-03T14:28:02.669Z"
-    >
-      Array [
-        <div
-          className="MuiFormControl-root-78 FormFieldBranch-field-71 FormFieldBranch-widthSmall-74 FormFieldBranch-fieldDate-73"
-          onClick={[Function]}
-          onKeyPress={[Function]}
-        >
-          <label
-            className="MuiFormLabel-root-93 MuiFormLabel-filled-97 MuiInputLabel-root-82 MuiInputLabel-formControl-87 MuiInputLabel-animated-90 MuiInputLabel-shrink-89"
-            data-shrink={true}
-            htmlFor="date"
-          >
-            Date
-          </label>
-          <div
-            className="MuiInputBase-root-113 MuiInput-root-100 MuiInput-underline-104 MuiInputBase-formControl-114 MuiInput-formControl-101 MuiInputBase-adornedEnd-118"
-            onClick={[Function]}
-          >
-            <input
-              aria-invalid={false}
-              className="MuiInputBase-input-123 MuiInput-input-108 MuiInputBase-inputAdornedEnd-129"
-              disabled={false}
-              id="date"
-              onBlur={[Function]}
-              onChange={[Function]}
-              onFocus={[Function]}
-              readOnly={false}
-              required={false}
-              type="text"
-              value="03.01.2018"
-            />
-            <div
-              className="MuiInputAdornment-root-191 MuiInputAdornment-positionEnd-194"
-            >
-              <button
-                className="MuiButtonBase-root-215 MuiIconButton-root-209"
-                disabled={false}
-                onBlur={[Function]}
-                onClick={[Function]}
-                onContextMenu={[Function]}
-                onFocus={[Function]}
-                onKeyDown={[Function]}
-                onKeyUp={[Function]}
-                onMouseDown={[Function]}
-                onMouseLeave={[Function]}
-                onMouseUp={[Function]}
-                onTouchEnd={[Function]}
-                onTouchMove={[Function]}
-                onTouchStart={[Function]}
-                tabIndex="0"
-                type="button"
-              >
-                <span
-                  className="MuiIconButton-label-214"
-                >
-                  <svg
-                    aria-hidden="true"
-                    className="MuiSvgIcon-root-137"
-                    focusable="false"
-                    role="presentation"
-                    viewBox="0 0 24 24"
-                  >
-                    <path
-                      d="M17 12h-5v5h5v-5zM16 1v2H8V1H6v2H5c-1.11 0-1.99.9-1.99 2L3 19c0 1.1.89 2 2 2h14c1.1 0 2-.9 2-2V5c0-1.1-.9-2-2-2h-1V1h-2zm3 18H5V8h14v11z"
-                    />
-                    <path
-                      d="M0 0h24v24H0z"
-                      fill="none"
-                    />
-                  </svg>
-                </span>
-                <span
-                  className="MuiTouchRipple-root-289"
-                />
-              </button>
-            </div>
-          </div>
-        </div>,
-        "",
-      ]
-    </ForwardRef>
-    <ForwardRef
-      className="FormFieldBranch-field-71 FormFieldBranch-widthSmall-74 FormFieldBranch-fieldDate-73"
-      clearable={true}
-      format="hh:mm a"
-      helperText=""
-      id="time"
-      keyboard={true}
-      keyboardIcon={<pure(EventIcon) />}
-      label="Time"
-      onChange={[Function]}
-      required={false}
-      value="2018-01-03T14:28:02.669Z"
-    >
+  <Form
+    data={
+      Object {
+        "id": Object {
+          "value": "test-id",
+        },
+        "text": Object {
+          "value": "prefilled text-field",
+        },
+      }
+    }
+    form={
       Array [
-        <div
-          className="MuiFormControl-root-78 FormFieldBranch-field-71 FormFieldBranch-widthSmall-74 FormFieldBranch-fieldDate-73"
-          onClick={[Function]}
-          onKeyPress={[Function]}
-        >
-          <label
-            className="MuiFormLabel-root-93 MuiFormLabel-filled-97 MuiInputLabel-root-82 MuiInputLabel-formControl-87 MuiInputLabel-animated-90 MuiInputLabel-shrink-89"
-            data-shrink={true}
-            htmlFor="time"
-          >
-            Time
-          </label>
-          <div
-            className="MuiInputBase-root-113 MuiInput-root-100 MuiInput-underline-104 MuiInputBase-formControl-114 MuiInput-formControl-101 MuiInputBase-adornedEnd-118"
-            onClick={[Function]}
-          >
-            <input
-              aria-invalid={false}
-              className="MuiInputBase-input-123 MuiInput-input-108 MuiInputBase-inputAdornedEnd-129"
-              disabled={false}
-              id="time"
-              onBlur={[Function]}
-              onChange={[Function]}
-              onFocus={[Function]}
-              readOnly={false}
-              required={false}
-              type="text"
-              value="03:28 pm"
-            />
-            <div
-              className="MuiInputAdornment-root-191 MuiInputAdornment-positionEnd-194"
-            >
-              <button
-                className="MuiButtonBase-root-215 MuiIconButton-root-209"
-                disabled={false}
-                onBlur={[Function]}
-                onClick={[Function]}
-                onContextMenu={[Function]}
-                onFocus={[Function]}
-                onKeyDown={[Function]}
-                onKeyUp={[Function]}
-                onMouseDown={[Function]}
-                onMouseLeave={[Function]}
-                onMouseUp={[Function]}
-                onTouchEnd={[Function]}
-                onTouchMove={[Function]}
-                onTouchStart={[Function]}
-                tabIndex="0"
-                type="button"
-              >
-                <span
-                  className="MuiIconButton-label-214"
-                >
-                  <svg
-                    aria-hidden="true"
-                    className="MuiSvgIcon-root-137"
-                    focusable="false"
-                    role="presentation"
-                    viewBox="0 0 24 24"
-                  >
-                    <path
-                      d="M17 12h-5v5h5v-5zM16 1v2H8V1H6v2H5c-1.11 0-1.99.9-1.99 2L3 19c0 1.1.89 2 2 2h14c1.1 0 2-.9 2-2V5c0-1.1-.9-2-2-2h-1V1h-2zm3 18H5V8h14v11z"
-                    />
-                    <path
-                      d="M0 0h24v24H0z"
-                      fill="none"
-                    />
-                  </svg>
-                </span>
-                <span
-                  className="MuiTouchRipple-root-289"
-                />
-              </button>
-            </div>
-          </div>
-        </div>,
-        "",
-      ]
-    </ForwardRef>
-    <ForwardRef
-      className="FormFieldBranch-field-71 FormFieldBranch-widthSmall-74 FormFieldBranch-fieldDate-73"
-      clearable={true}
-      dateRangeIcon={<pure(DateRangeIcon) />}
-      format="DD.MM.YYYY, hh:mm a"
-      helperText=""
-      id="datetime"
-      keyboard={true}
-      keyboardIcon={<pure(EventIcon) />}
-      label="Datetime"
-      leftArrowIcon={<pure(KeyboardArrowLeftIcon) />}
-      onChange={[Function]}
-      required={false}
-      rightArrowIcon={<pure(KeyboardArrowRightIcon) />}
-      timeIcon={<pure(AccessTimeIcon) />}
-      value="2018-01-03T14:28:02.669Z"
-    >
-      Array [
-        <div
-          className="MuiFormControl-root-78 FormFieldBranch-field-71 FormFieldBranch-widthSmall-74 FormFieldBranch-fieldDate-73"
-          onClick={[Function]}
-          onKeyPress={[Function]}
-        >
-          <label
-            className="MuiFormLabel-root-93 MuiFormLabel-filled-97 MuiInputLabel-root-82 MuiInputLabel-formControl-87 MuiInputLabel-animated-90 MuiInputLabel-shrink-89"
-            data-shrink={true}
-            htmlFor="datetime"
-          >
-            Datetime
-          </label>
-          <div
-            className="MuiInputBase-root-113 MuiInput-root-100 MuiInput-underline-104 MuiInputBase-formControl-114 MuiInput-formControl-101 MuiInputBase-adornedEnd-118"
-            onClick={[Function]}
-          >
-            <input
-              aria-invalid={false}
-              className="MuiInputBase-input-123 MuiInput-input-108 MuiInputBase-inputAdornedEnd-129"
-              disabled={false}
-              id="datetime"
-              onBlur={[Function]}
-              onChange={[Function]}
-              onFocus={[Function]}
-              readOnly={false}
-              required={false}
-              type="text"
-              value="03.01.2018, 03:28 pm"
-            />
-            <div
-              className="MuiInputAdornment-root-191 MuiInputAdornment-positionEnd-194"
-            >
-              <button
-                className="MuiButtonBase-root-215 MuiIconButton-root-209"
-                disabled={false}
-                onBlur={[Function]}
-                onClick={[Function]}
-                onContextMenu={[Function]}
-                onFocus={[Function]}
-                onKeyDown={[Function]}
-                onKeyUp={[Function]}
-                onMouseDown={[Function]}
-                onMouseLeave={[Function]}
-                onMouseUp={[Function]}
-                onTouchEnd={[Function]}
-                onTouchMove={[Function]}
-                onTouchStart={[Function]}
-                tabIndex="0"
-                type="button"
-              >
-                <span
-                  className="MuiIconButton-label-214"
+        Object {
+          "data": Array [
+            Object {
+              "id": "text",
+              "isRequired": true,
+              "title": "Text Field",
+              "type": "text",
+              "width": "small",
+            },
+            Object {
+              "id": "select",
+              "isRequired": true,
+              "options": Array [
+                "Foo",
+                "Bar",
+                "Baz",
+              ],
+              "title": "Select",
+              "type": "select",
+              "width": "small",
+            },
+            Object {
+              "id": "number",
+              "title": "Number",
+              "type": "number",
+              "value": 10,
+              "width": "small",
+            },
+            Object {
+              "id": "multiline",
+              "rows": 5,
+              "title": "Multiline",
+              "type": "multiline",
+            },
+            Object {
+              "completeFrom": Array [
+                Object {
+                  "title": "Foo",
+                  "tooltip": "Foo-Baz",
+                },
+                "Bar",
+                Object {
+                  "title": "Baz",
+                  "tooltip": "Foo-Baz",
+                },
+                Object {
+                  "title": "Froot",
+                },
+                Object {
+                  "title": "Foobar",
+                  "tooltip": "Foo-Baz",
+                },
+                Object {
+                  "title": "Barbaz",
+                  "tooltip": "Foo-Baz",
+                },
+                Object {
+                  "title": "Foobaz",
+                },
+              ],
+              "id": "list",
+              "title": "List",
+              "type": "list",
+              "value": Array [
+                "Foo",
+                "Bar",
+                "Baz",
+              ],
+              "width": "mid",
+            },
+            Object {
+              "id": "free-list",
+              "title": "Free List",
+              "type": "list",
+              "width": "mid",
+            },
+            Object {
+              "data": Array [
+                Object {
+                  "iconEnd": <Memo />,
+                  "id": "nested-text",
+                  "title": "Nested Text",
+                  "type": "text",
+                  "width": "mid",
+                },
+                Object {
+                  "id": "empty",
+                  "type": "empty",
+                  "width": "mid",
+                },
+              ],
+              "group": true,
+              "id": "nested",
+              "integrated": true,
+              "isVisible": true,
+              "title": "Nested Form",
+            },
+            Object {
+              "content": <React.Fragment>
+                <ForwardRef(WithStyles)
+                  variant="h5"
                 >
-                  <svg
-                    aria-hidden="true"
-                    className="MuiSvgIcon-root-137"
-                    focusable="false"
-                    role="presentation"
-                    viewBox="0 0 24 24"
-                  >
-                    <path
-                      d="M17 12h-5v5h5v-5zM16 1v2H8V1H6v2H5c-1.11 0-1.99.9-1.99 2L3 19c0 1.1.89 2 2 2h14c1.1 0 2-.9 2-2V5c0-1.1-.9-2-2-2h-1V1h-2zm3 18H5V8h14v11z"
-                    />
-                    <path
-                      d="M0 0h24v24H0z"
-                      fill="none"
-                    />
-                  </svg>
-                </span>
-                <span
-                  className="MuiTouchRipple-root-289"
-                />
-              </button>
-            </div>
-          </div>
-        </div>,
-        "",
-      ]
-    </ForwardRef>
-  </div>
-  <div
-    className="MuiPaper-root-6 MuiPaper-elevation2-10 MuiPaper-rounded-7 FormGroupWrapper-group-3"
-  >
-    <h2
-      className="MuiTypography-root-33 MuiTypography-title-39 FormBranch-title-1"
-    >
-      Form - Disabled fields
-    </h2>
-    <div
-      className="MuiFormControl-root-78 MuiFormControl-marginNormal-79 MuiFormControl-fullWidth-81 FormFieldBranch-field-71 FormFieldBranch-widthMid-75"
-      onKeyPress={[Function]}
-    >
-      <label
-        className="MuiFormLabel-root-93 MuiFormLabel-disabled-95 MuiInputLabel-disabled-84 MuiInputLabel-root-82 MuiInputLabel-formControl-87 MuiInputLabel-animated-90"
-        data-shrink={false}
-        htmlFor="disabled"
-      >
-        Disabled Text
-      </label>
-      <div
-        className="MuiInputBase-root-113 MuiInput-root-100 MuiInput-underline-104 MuiInputBase-disabled-116 MuiInput-disabled-103 MuiInputBase-fullWidth-122 MuiInput-fullWidth-107 MuiInputBase-formControl-114 MuiInput-formControl-101 MuiInputBase-adornedEnd-118"
-        onClick={[Function]}
-      >
-        <input
-          aria-invalid={false}
-          className="MuiInputBase-input-123 MuiInput-input-108 MuiInputBase-disabled-116 MuiInput-disabled-103 MuiInputBase-inputAdornedEnd-129"
-          disabled={true}
-          id="disabled"
-          onBlur={[Function]}
-          onChange={[Function]}
-          onFocus={[Function]}
-          required={false}
-          rows={1}
-          type="text"
-          value=""
-        />
-      </div>
-    </div>
-    <div
-      className="MuiFormControl-root-78 MuiFormControl-marginNormal-79 MuiFormControl-fullWidth-81 FormFieldBranch-field-71 FormFieldBranch-widthMid-75"
-      onKeyPress={[Function]}
-    >
-      <label
-        className="MuiFormLabel-root-93 MuiFormLabel-disabled-95 MuiInputLabel-disabled-84 MuiInputLabel-root-82 MuiInputLabel-formControl-87 MuiInputLabel-animated-90"
-        data-shrink={false}
-        htmlFor="disabled-select"
-      >
-        Disabled Select
-      </label>
-      <div
-        className="MuiInputBase-root-113 MuiInput-root-100 MuiInput-underline-104 MuiInputBase-disabled-116 MuiInput-disabled-103 MuiInputBase-fullWidth-122 MuiInput-fullWidth-107 MuiInputBase-formControl-114 MuiInput-formControl-101 MuiInputBase-adornedEnd-118"
-        onClick={[Function]}
-      >
-        <div
-          className="MuiSelect-root-130"
-        >
-          <div
-            aria-haspopup="true"
-            aria-pressed="false"
-            className="MuiSelect-select-131 MuiSelect-selectMenu-134 MuiSelect-disabled-135 MuiInputBase-input-123 MuiInput-input-108 MuiInputBase-disabled-116 MuiInput-disabled-103 MuiInputBase-inputAdornedEnd-129"
-            onBlur={[Function]}
-            onClick={null}
-            onFocus={[Function]}
-            onKeyDown={[Function]}
-            role="button"
-            tabIndex={null}
-          >
-            <span
-              dangerouslySetInnerHTML={
+                  Content
+                </ForwardRef(WithStyles)>
+                <ForwardRef(WithStyles) />
+              </React.Fragment>,
+              "id": "content",
+              "type": "content",
+            },
+            Object {
+              "beforeSubmit": [Function],
+              "id": "email",
+              "title": "Email",
+              "type": "email",
+              "width": "mid",
+            },
+            Object {
+              "id": "password",
+              "title": "Password",
+              "type": "password",
+              "width": "mid",
+            },
+            Object {
+              "helperText": "Should be URL with trailing slash",
+              "id": "url",
+              "title": "URL",
+              "type": "url",
+              "validators": Array [
                 Object {
-                  "__html": "&#8203;",
-                }
-              }
-            />
-          </div>
-          <input
-            id="disabled-select"
-            rows={1}
-            type="hidden"
-            value=""
-          />
-          <svg
-            aria-hidden="true"
-            className="MuiSvgIcon-root-137 MuiSelect-icon-136"
-            focusable="false"
-            role="presentation"
-            viewBox="0 0 24 24"
-          >
-            <path
-              d="M7 10l5 5 5-5z"
-            />
-          </svg>
-        </div>
-      </div>
-    </div>
-  </div>
-  <div
-    className="MuiPaper-root-6 MuiPaper-elevation2-10 MuiPaper-rounded-7 FormGroupWrapper-group-3"
-  >
-    <h2
-      className="MuiTypography-root-33 MuiTypography-title-39 FormBranch-title-1"
-    >
-      Form - Switches, Radio Buttons and Checkboxes
-    </h2>
-    <div
-      className="FormFieldBranch-field-71 FormFieldBranch-widthSmall-74 FormFieldBranch-fieldInline-72"
-    >
-      <label
-        className="MuiFormControlLabel-root-240"
-      >
-        <span
-          className="MuiSwitch-root-246"
-        >
-          <span
-            className="MuiButtonBase-root-215 MuiIconButton-root-209 MuiPrivateSwitchBase-root-255 MuiSwitch-switchBase-249 MuiSwitch-colorPrimary-251"
-            onBlur={[Function]}
-            onContextMenu={[Function]}
-            onFocus={[Function]}
-            onKeyDown={[Function]}
-            onKeyUp={[Function]}
-            onMouseDown={[Function]}
-            onMouseLeave={[Function]}
-            onMouseUp={[Function]}
-            onTouchEnd={[Function]}
-            onTouchMove={[Function]}
-            onTouchStart={[Function]}
-            tabIndex={null}
-          >
-            <span
-              className="MuiIconButton-label-214"
-            >
-              <span
-                className="MuiSwitch-icon-247"
-              />
-              <input
-                checked={false}
-                className="MuiPrivateSwitchBase-input-258"
-                disabled={false}
-                onChange={[Function]}
-                type="checkbox"
-                value="switch"
-              />
-            </span>
-            <span
-              className="MuiTouchRipple-root-289"
-            />
-          </span>
-          <span
-            className="MuiSwitch-bar-254"
-          />
-        </span>
-        <span
-          className="MuiTypography-root-33 MuiTypography-body1-42 MuiFormControlLabel-label-245"
-        >
-          Switch
-        </span>
-      </label>
-      <p
-        className="MuiFormHelperText-root-201"
-      >
-        Display Helper Text
-      </p>
-    </div>
-    <div
-      className="FormFieldBranch-field-71 FormFieldBranch-widthSmall-74 FormFieldBranch-fieldInline-72"
-    >
-      <label
-        className="MuiFormControlLabel-root-240 MuiFormControlLabel-disabled-244"
-      >
-        <span
-          className="MuiSwitch-root-246"
-        >
-          <span
-            className="MuiButtonBase-root-215 MuiButtonBase-disabled-216 MuiIconButton-root-209 MuiIconButton-disabled-213 MuiPrivateSwitchBase-root-255 MuiSwitch-switchBase-249 MuiSwitch-colorPrimary-251 MuiPrivateSwitchBase-disabled-257 MuiSwitch-disabled-253"
-            onBlur={[Function]}
-            onContextMenu={[Function]}
-            onFocus={[Function]}
-            onKeyDown={[Function]}
-            onKeyUp={[Function]}
-            onMouseDown={[Function]}
-            onMouseLeave={[Function]}
-            onMouseUp={[Function]}
-            onTouchEnd={[Function]}
-            onTouchMove={[Function]}
-            onTouchStart={[Function]}
-            tabIndex="-1"
-          >
-            <span
-              className="MuiIconButton-label-214"
-            >
-              <span
-                className="MuiSwitch-icon-247"
-              />
-              <input
-                checked={false}
-                className="MuiPrivateSwitchBase-input-258"
-                disabled={true}
-                onChange={[Function]}
-                type="checkbox"
-                value="switch-1"
-              />
-            </span>
-          </span>
-          <span
-            className="MuiSwitch-bar-254"
-          />
-        </span>
-        <span
-          className="MuiTypography-root-33 MuiTypography-body1-42 MuiFormControlLabel-label-245 MuiFormControlLabel-disabled-244"
-        >
-          Switch - Disabled
-        </span>
-      </label>
-      <p
-        className="MuiFormHelperText-root-201 MuiFormHelperText-disabled-203"
-      >
-        Display Helper Text
-      </p>
-    </div>
-  </div>
-  <p>
-    Foo
-  </p>
-  <div
-    className="FormSubmitButton-root-259"
+                  "message": "Please add a trailing slash to your URL",
+                  "validator": [Function],
+                },
+              ],
+              "width": "mid",
+            },
+            Object {
+              "id": "empty",
+              "type": "email",
+              "width": "mid",
+            },
+          ],
+          "group": true,
+          "id": "base",
+          "title": "Form",
+        },
+        Object {
+          "data": Array [
+            Object {
+              "format": "DD.MM.YYYY",
+              "id": "date",
+              "title": "Date",
+              "type": "date",
+              "validators": Array [
+                "date",
+              ],
+              "value": 1514989682669,
+              "width": "small",
+            },
+            Object {
+              "format": "hh:mm a",
+              "id": "time",
+              "title": "Time",
+              "type": "time",
+              "validators": Array [
+                "date",
+              ],
+              "value": 1514989682669,
+              "width": "small",
+            },
+            Object {
+              "format": "DD.MM.YYYY, hh:mm a",
+              "id": "datetime",
+              "title": "Datetime",
+              "type": "datetime",
+              "validators": Array [
+                "date",
+              ],
+              "value": 1514989682669,
+              "width": "small",
+            },
+          ],
+          "group": true,
+          "id": "date",
+          "title": "Form - Date",
+        },
+        Object {
+          "data": Array [
+            Object {
+              "id": "disabled",
+              "isDisabled": true,
+              "title": "Disabled Text",
+              "type": "text",
+              "width": "mid",
+            },
+            Object {
+              "id": "disabled-select",
+              "isDisabled": true,
+              "options": Array [
+                "Foo",
+                "Bar",
+                "Baz",
+              ],
+              "title": "Disabled Select",
+              "type": "select",
+              "width": "mid",
+            },
+          ],
+          "group": true,
+          "id": "disabled",
+          "title": "Form - Disabled fields",
+        },
+        Object {
+          "data": Array [
+            Object {
+              "helperText": "Display Helper Text",
+              "id": "switch",
+              "title": "Switch",
+              "type": "switch",
+              "width": "small",
+            },
+            Object {
+              "helperText": "Display Helper Text",
+              "id": "switch-1",
+              "isDisabled": true,
+              "title": "Switch - Disabled",
+              "type": "switch",
+              "width": "small",
+            },
+          ],
+          "group": true,
+          "id": "switches",
+          "title": "Form - Switches, Radio Buttons and Checkboxes",
+        },
+      ]
+    }
+    isFixedSubmitButton={false}
+    onDataChanged={[Function]}
+    onSubmit={[Function]}
+    submitText="Save the form"
   >
-    <button
-      className="MuiButtonBase-root-215 MuiButton-root-263 MuiButton-contained-274 MuiButton-containedSecondary-276 MuiButton-raised-277 MuiButton-raisedSecondary-279 FormSubmitButton-button-261"
-      disabled={false}
-      onBlur={[Function]}
-      onClick={[Function]}
-      onContextMenu={[Function]}
-      onFocus={[Function]}
-      onKeyDown={[Function]}
-      onKeyUp={[Function]}
-      onMouseDown={[Function]}
-      onMouseLeave={[Function]}
-      onMouseUp={[Function]}
-      onTouchEnd={[Function]}
-      onTouchMove={[Function]}
-      onTouchStart={[Function]}
-      tabIndex="0"
-      type="button"
-    >
-      <span
-        className="MuiButton-label-264"
-      >
-        Save the form
-      </span>
-      <span
-        className="MuiTouchRipple-root-289"
-      />
-    </button>
-  </div>
-</form>
+    <p>
+      Foo
+    </p>
+  </Form>
+</Router>
 `;
diff --git a/src/Form/__snapshots__/FormFieldInput.test.jsx.snap b/src/Form/__snapshots__/FormFieldInput.test.jsx.snap
index 2232ba5..ef1962a 100644
--- a/src/Form/__snapshots__/FormFieldInput.test.jsx.snap
+++ b/src/Form/__snapshots__/FormFieldInput.test.jsx.snap
@@ -1,51 +1,55 @@
 // Jest Snapshot v1, https://goo.gl/fbAQLP
 
 exports[`renders correctly 1`] = `
-<div
-  className="MuiFormControl-root-1 MuiFormControl-marginNormal-2 MuiFormControl-fullWidth-4"
+<WithStyles(ForwardRef(TextField))
+  InputProps={
+    Object {
+      "endAdornment": <InputEnd
+        icon={null}
+      />,
+    }
+  }
+  className=""
+  disabled={false}
+  error={false}
+  fullWidth={true}
+  helperText=""
+  margin="normal"
+  multiline={false}
+  onBlur={[Function]}
+  onFocus={[Function]}
   onKeyPress={[Function]}
->
-  <div
-    className="MuiInputBase-root-18 MuiInput-root-5 MuiInput-underline-9 MuiInputBase-fullWidth-27 MuiInput-fullWidth-12 MuiInputBase-formControl-19 MuiInput-formControl-6 MuiInputBase-adornedEnd-23"
-    onClick={[Function]}
-  >
-    <input
-      aria-invalid={false}
-      className="MuiInputBase-input-28 MuiInput-input-13 MuiInputBase-inputAdornedEnd-34"
-      disabled={false}
-      onBlur={[Function]}
-      onChange={[Function]}
-      onFocus={[Function]}
-      required={false}
-      rows={1}
-      type="text"
-      value=""
-    />
-  </div>
-</div>
+  required={false}
+  rows={1}
+  select={false}
+  type="text"
+  value=""
+/>
 `;
 
 exports[`renders disabled 1`] = `
-<div
-  className="MuiFormControl-root-1 MuiFormControl-marginNormal-2 MuiFormControl-fullWidth-4"
+<WithStyles(ForwardRef(TextField))
+  InputProps={
+    Object {
+      "endAdornment": <InputEnd
+        icon={null}
+      />,
+    }
+  }
+  className=""
+  disabled={true}
+  error={false}
+  fullWidth={true}
+  helperText=""
+  margin="normal"
+  multiline={false}
+  onBlur={[Function]}
+  onFocus={[Function]}
   onKeyPress={[Function]}
->
-  <div
-    className="MuiInputBase-root-18 MuiInput-root-5 MuiInput-underline-9 MuiInputBase-disabled-21 MuiInput-disabled-8 MuiInputBase-fullWidth-27 MuiInput-fullWidth-12 MuiInputBase-formControl-19 MuiInput-formControl-6 MuiInputBase-adornedEnd-23"
-    onClick={[Function]}
-  >
-    <input
-      aria-invalid={false}
-      className="MuiInputBase-input-28 MuiInput-input-13 MuiInputBase-disabled-21 MuiInput-disabled-8 MuiInputBase-inputAdornedEnd-34"
-      disabled={true}
-      onBlur={[Function]}
-      onChange={[Function]}
-      onFocus={[Function]}
-      required={false}
-      rows={1}
-      type="text"
-      value=""
-    />
-  </div>
-</div>
+  required={false}
+  rows={1}
+  select={false}
+  type="text"
+  value=""
+/>
 `;
diff --git a/src/Form/__snapshots__/FormFieldSwitch.test.jsx.snap b/src/Form/__snapshots__/FormFieldSwitch.test.jsx.snap
index 8f0d02a..b742ff5 100644
--- a/src/Form/__snapshots__/FormFieldSwitch.test.jsx.snap
+++ b/src/Form/__snapshots__/FormFieldSwitch.test.jsx.snap
@@ -4,56 +4,18 @@ exports[`renders correctly 1`] = `
 <div
   className=""
 >
-  <label
-    className="MuiFormControlLabel-root-1"
-  >
-    <span
-      className="MuiSwitch-root-7"
-    >
-      <span
-        className="MuiButtonBase-root-26 MuiIconButton-root-20 MuiPrivateSwitchBase-root-16 MuiSwitch-switchBase-10 MuiSwitch-colorPrimary-12"
-        onBlur={[Function]}
-        onContextMenu={[Function]}
-        onFocus={[Function]}
-        onKeyDown={[Function]}
-        onKeyUp={[Function]}
-        onMouseDown={[Function]}
-        onMouseLeave={[Function]}
-        onMouseUp={[Function]}
-        onTouchEnd={[Function]}
-        onTouchMove={[Function]}
-        onTouchStart={[Function]}
-        tabIndex={null}
-      >
-        <span
-          className="MuiIconButton-label-25"
-        >
-          <span
-            className="MuiSwitch-icon-8"
-          />
-          <input
-            checked={false}
-            className="MuiPrivateSwitchBase-input-19"
-            disabled={false}
-            onChange={[Function]}
-            type="checkbox"
-            value="switch"
-          />
-        </span>
-        <span
-          className="MuiTouchRipple-root-65"
-        />
-      </span>
-      <span
-        className="MuiSwitch-bar-15"
+  <WithStyles(WithFormControlContext(ForwardRef(FormControlLabel)))
+    control={
+      <ForwardRef(WithStyles)
+        checked={false}
+        color="primary"
+        onChange={[Function]}
+        value="switch"
       />
-    </span>
-    <span
-      className="MuiTypography-root-29 MuiTypography-body1-38 MuiFormControlLabel-label-6"
-    >
-      Title
-    </span>
-  </label>
+    }
+    disabled={false}
+    label="Title"
+  />
 </div>
 `;
 
@@ -61,53 +23,18 @@ exports[`renders disabled 1`] = `
 <div
   className=""
 >
-  <label
-    className="MuiFormControlLabel-root-1 MuiFormControlLabel-disabled-5"
-  >
-    <span
-      className="MuiSwitch-root-7"
-    >
-      <span
-        className="MuiButtonBase-root-26 MuiButtonBase-disabled-27 MuiIconButton-root-20 MuiIconButton-disabled-24 MuiPrivateSwitchBase-root-16 MuiSwitch-switchBase-10 MuiSwitch-colorPrimary-12 MuiPrivateSwitchBase-disabled-18 MuiSwitch-disabled-14"
-        onBlur={[Function]}
-        onContextMenu={[Function]}
-        onFocus={[Function]}
-        onKeyDown={[Function]}
-        onKeyUp={[Function]}
-        onMouseDown={[Function]}
-        onMouseLeave={[Function]}
-        onMouseUp={[Function]}
-        onTouchEnd={[Function]}
-        onTouchMove={[Function]}
-        onTouchStart={[Function]}
-        tabIndex="-1"
-      >
-        <span
-          className="MuiIconButton-label-25"
-        >
-          <span
-            className="MuiSwitch-icon-8"
-          />
-          <input
-            checked={false}
-            className="MuiPrivateSwitchBase-input-19"
-            disabled={true}
-            onChange={[Function]}
-            type="checkbox"
-            value="switch"
-          />
-        </span>
-      </span>
-      <span
-        className="MuiSwitch-bar-15"
+  <WithStyles(WithFormControlContext(ForwardRef(FormControlLabel)))
+    control={
+      <ForwardRef(WithStyles)
+        checked={false}
+        color="primary"
+        onChange={[Function]}
+        value="switch"
       />
-    </span>
-    <span
-      className="MuiTypography-root-29 MuiTypography-body1-38 MuiFormControlLabel-label-6 MuiFormControlLabel-disabled-5"
-    >
-      Title
-    </span>
-  </label>
+    }
+    disabled={true}
+    label="Title"
+  />
 </div>
 `;
 
@@ -115,60 +42,22 @@ exports[`renders with helper text 1`] = `
 <div
   className=""
 >
-  <label
-    className="MuiFormControlLabel-root-1"
-  >
-    <span
-      className="MuiSwitch-root-7"
-    >
-      <span
-        className="MuiButtonBase-root-26 MuiIconButton-root-20 MuiPrivateSwitchBase-root-16 MuiSwitch-switchBase-10 MuiSwitch-colorPrimary-12"
-        onBlur={[Function]}
-        onContextMenu={[Function]}
-        onFocus={[Function]}
-        onKeyDown={[Function]}
-        onKeyUp={[Function]}
-        onMouseDown={[Function]}
-        onMouseLeave={[Function]}
-        onMouseUp={[Function]}
-        onTouchEnd={[Function]}
-        onTouchMove={[Function]}
-        onTouchStart={[Function]}
-        tabIndex={null}
-      >
-        <span
-          className="MuiIconButton-label-25"
-        >
-          <span
-            className="MuiSwitch-icon-8"
-          />
-          <input
-            checked={false}
-            className="MuiPrivateSwitchBase-input-19"
-            disabled={false}
-            onChange={[Function]}
-            type="checkbox"
-            value="switch"
-          />
-        </span>
-        <span
-          className="MuiTouchRipple-root-65"
-        />
-      </span>
-      <span
-        className="MuiSwitch-bar-15"
+  <WithStyles(WithFormControlContext(ForwardRef(FormControlLabel)))
+    control={
+      <ForwardRef(WithStyles)
+        checked={false}
+        color="primary"
+        onChange={[Function]}
+        value="switch"
       />
-    </span>
-    <span
-      className="MuiTypography-root-29 MuiTypography-body1-38 MuiFormControlLabel-label-6"
-    >
-      Title
-    </span>
-  </label>
-  <p
-    className="MuiFormHelperText-root-72"
+    }
+    disabled={false}
+    label="Title"
+  />
+  <WithStyles(WithFormControlContext(ForwardRef(FormHelperText)))
+    disabled={false}
   >
     test
-  </p>
+  </WithStyles(WithFormControlContext(ForwardRef(FormHelperText)))>
 </div>
 `;
diff --git a/src/Header/Header.test.jsx b/src/Header/Header.test.jsx
index 67153f1..c68f46a 100644
--- a/src/Header/Header.test.jsx
+++ b/src/Header/Header.test.jsx
@@ -1,10 +1,10 @@
 import React from 'react'
-import { mount } from 'enzyme'
+import { shallow } from 'enzyme'
 
-import Header from './'
+import Header from '.'
 
 it('renders correctly', () => {
-  const tree = mount((
+  const tree = shallow((
     <Header
       isOpen
       title="Header"
@@ -19,7 +19,7 @@ it('renders correctly', () => {
 })
 
 it('renders correctly with closed', () => {
-  const tree = mount((
+  const tree = shallow((
     <Header
       title="Header"
       isFixed={false}
diff --git a/src/Header/__snapshots__/Header.test.jsx.snap b/src/Header/__snapshots__/Header.test.jsx.snap
index 842bff2..fc8ca44 100644
--- a/src/Header/__snapshots__/Header.test.jsx.snap
+++ b/src/Header/__snapshots__/Header.test.jsx.snap
@@ -1,127 +1,47 @@
 // Jest Snapshot v1, https://goo.gl/fbAQLP
 
 exports[`renders correctly 1`] = `
-<div
-  className="Header-root-1"
->
-  <header
-    className="MuiPaper-root-18 MuiPaper-elevation4-24 MuiAppBar-root-9 MuiAppBar-positionFixed-10 MuiAppBar-colorPrimary-16 mui-fixed Header-appBar-2 Header-appBarShift-4 Header-appBarWithCookieInfo-3"
-  >
-    <div
-      className="MuiToolbar-root-45 MuiToolbar-regular-47 MuiToolbar-gutters-46"
-    >
-      <button
-        aria-label="open drawer"
-        className="MuiButtonBase-root-55 MuiIconButton-root-49 MuiIconButton-colorInherit-50 Header-menuButton-5 Header-hide-6"
-        disabled={false}
-        onBlur={[Function]}
-        onClick={[Function]}
-        onContextMenu={[Function]}
-        onFocus={[Function]}
-        onKeyDown={[Function]}
-        onKeyUp={[Function]}
-        onMouseDown={[Function]}
-        onMouseLeave={[Function]}
-        onMouseUp={[Function]}
-        onTouchEnd={[Function]}
-        onTouchMove={[Function]}
-        onTouchStart={[Function]}
-        tabIndex="0"
-        type="button"
-      >
-        <span
-          className="MuiIconButton-label-54"
-        >
-          <svg
-            aria-hidden="true"
-            className="MuiSvgIcon-root-58"
-            focusable="false"
-            role="presentation"
-            viewBox="0 0 24 24"
-          >
-            <path
-              d="M0 0h24v24H0z"
-              fill="none"
-            />
-            <path
-              d="M3 18h18v-2H3v2zm0-5h18v-2H3v2zm0-7v2h18V6H3z"
-            />
-          </svg>
-        </span>
-        <span
-          className="MuiTouchRipple-root-103"
-        />
-      </button>
-      <h6
-        className="MuiTypography-root-67 MuiTypography-h6-84 MuiTypography-colorInherit-96 Header-flex-7 Header-title-8"
-        onClick={[Function]}
-      >
-        Header
-      </h6>
-    </div>
-  </header>
-</div>
+<Header
+  classes={
+    Object {
+      "appBar": "Header-appBar-2",
+      "appBarShift": "Header-appBarShift-4",
+      "appBarWithCookieInfo": "Header-appBarWithCookieInfo-3",
+      "flex": "Header-flex-7",
+      "hide": "Header-hide-6",
+      "menuButton": "Header-menuButton-5",
+      "root": "Header-root-1",
+      "title": "Header-title-8",
+    }
+  }
+  isCookieInfoOpen={true}
+  isFixed={true}
+  isOpen={true}
+  onClick={[Function]}
+  onDrawerOpen={[Function]}
+  title="Header"
+/>
 `;
 
 exports[`renders correctly with closed 1`] = `
-<div
-  className="Header-root-1"
->
-  <header
-    className="MuiPaper-root-18 MuiPaper-elevation4-24 MuiAppBar-root-9 MuiAppBar-positionStatic-13 MuiAppBar-colorPrimary-16 Header-appBar-2"
-  >
-    <div
-      className="MuiToolbar-root-45 MuiToolbar-regular-47 MuiToolbar-gutters-46"
-    >
-      <button
-        aria-label="open drawer"
-        className="MuiButtonBase-root-55 MuiIconButton-root-49 MuiIconButton-colorInherit-50 Header-menuButton-5"
-        disabled={false}
-        onBlur={[Function]}
-        onClick={[Function]}
-        onContextMenu={[Function]}
-        onFocus={[Function]}
-        onKeyDown={[Function]}
-        onKeyUp={[Function]}
-        onMouseDown={[Function]}
-        onMouseLeave={[Function]}
-        onMouseUp={[Function]}
-        onTouchEnd={[Function]}
-        onTouchMove={[Function]}
-        onTouchStart={[Function]}
-        tabIndex="0"
-        type="button"
-      >
-        <span
-          className="MuiIconButton-label-54"
-        >
-          <svg
-            aria-hidden="true"
-            className="MuiSvgIcon-root-58"
-            focusable="false"
-            role="presentation"
-            viewBox="0 0 24 24"
-          >
-            <path
-              d="M0 0h24v24H0z"
-              fill="none"
-            />
-            <path
-              d="M3 18h18v-2H3v2zm0-5h18v-2H3v2zm0-7v2h18V6H3z"
-            />
-          </svg>
-        </span>
-        <span
-          className="MuiTouchRipple-root-103"
-        />
-      </button>
-      <h6
-        className="MuiTypography-root-67 MuiTypography-h6-84 MuiTypography-colorInherit-96 Header-flex-7 Header-title-8"
-        onClick={[Function]}
-      >
-        Header
-      </h6>
-    </div>
-  </header>
-</div>
+<Header
+  classes={
+    Object {
+      "appBar": "Header-appBar-2",
+      "appBarShift": "Header-appBarShift-4",
+      "appBarWithCookieInfo": "Header-appBarWithCookieInfo-3",
+      "flex": "Header-flex-7",
+      "hide": "Header-hide-6",
+      "menuButton": "Header-menuButton-5",
+      "root": "Header-root-1",
+      "title": "Header-title-8",
+    }
+  }
+  isCookieInfoOpen={false}
+  isFixed={false}
+  isOpen={false}
+  onClick={[Function]}
+  onDrawerOpen={[Function]}
+  title="Header"
+/>
 `;
diff --git a/src/Listing/Listing.test.jsx b/src/Listing/Listing.test.jsx
index 761385a..346e98e 100644
--- a/src/Listing/Listing.test.jsx
+++ b/src/Listing/Listing.test.jsx
@@ -1,5 +1,5 @@
 import React from 'react'
-import Enzyme, { mount, shallow } from 'enzyme'
+import Enzyme, { shallow } from 'enzyme'
 import Adapter from 'enzyme-adapter-react-16'
 import {
   Checkbox,
@@ -7,17 +7,17 @@ import {
   IconButton,
 } from '@material-ui/core'
 
-import Listing from './'
+import Listing from '.'
 
-import headers from '../../__tests__/data/listing_headers'
-import data from '../../__tests__/data/listing_data'
+import headers from '../tests/data/listing_headers'
+import data from '../tests/data/listing_data'
 import ListingHeader from './ListingHeader'
 
 Enzyme.configure({ adapter: new Adapter() })
 
 describe('Listing', () => {
   it('renders correctly', () => {
-    const tree = mount((
+    const tree = shallow((
       <Listing
         title="Christmas Time"
         data={data}
@@ -32,7 +32,7 @@ describe('Listing', () => {
   })
 
   it('renders correctly with Loader', () => {
-    const tree = mount((
+    const tree = shallow((
       <Listing
         title="Christmas Time"
         data={data}
@@ -172,7 +172,7 @@ describe('Listing', () => {
   })
 
   it('selects all elements when checkbox is clicked', () => {
-    const listing = mount((
+    const listing = shallow((
       <Listing
         title="Christmas Time"
         data={data}
@@ -188,7 +188,7 @@ describe('Listing', () => {
   })
 
   it('deselects all elements when checkbox is unset', () => {
-    const listing = mount((
+    const listing = shallow((
       <Listing
         title="Christmas Time"
         data={data}
@@ -204,7 +204,7 @@ describe('Listing', () => {
   })
 
   it('handles changing the no of rows per age', () => {
-    const listing = mount((
+    const listing = shallow((
       <Listing
         title="Christmas Time"
         data={data}
@@ -226,7 +226,7 @@ describe('Listing', () => {
   it('handles changing the page', () => {
     window.scrollTo = () => {}
 
-    const listing = mount((
+    const listing = shallow((
       <Listing
         title="Christmas Time"
         data={data}
diff --git a/src/Listing/ListingHeader.test.jsx b/src/Listing/ListingHeader.test.jsx
index 1dc22b3..ca166fe 100644
--- a/src/Listing/ListingHeader.test.jsx
+++ b/src/Listing/ListingHeader.test.jsx
@@ -1,12 +1,12 @@
 import React from 'react'
-import { mount } from 'enzyme'
+import { shallow } from 'enzyme'
 
 import { Table } from '@material-ui/core'
 
 import ListingHeader from './ListingHeader'
 
 it('renders correctly', () => {
-  const tree = mount((
+  const tree = shallow((
     <Table>
       <ListingHeader
         headers={[{
diff --git a/src/Listing/ListingLine.test.jsx b/src/Listing/ListingLine.test.jsx
index 6833e98..be35ac4 100644
--- a/src/Listing/ListingLine.test.jsx
+++ b/src/Listing/ListingLine.test.jsx
@@ -1,15 +1,15 @@
 import React from 'react'
-import { mount } from 'enzyme'
+import { shallow } from 'enzyme'
 import { Table } from '@material-ui/core'
 
 import ListingLine from './ListingLine'
 
-import headers from '../../__tests__/data/listing_headers'
+import headers from '../tests/data/listing_headers'
 
 const twoHeaders = headers.slice(0, 2)
 
 it('renders correctly', () => {
-  const tree = mount((
+  const tree = shallow((
     <Table>
       <ListingLine
         headers={twoHeaders}
@@ -30,7 +30,7 @@ it('renders correctly', () => {
 })
 
 it('renders selected', () => {
-  const tree = mount((
+  const tree = shallow((
     <Table>
       <ListingLine
         headers={twoHeaders}
@@ -51,7 +51,7 @@ it('renders selected', () => {
 })
 
 it('renders highlighted', () => {
-  const tree = mount((
+  const tree = shallow((
     <Table>
       <ListingLine
         headers={twoHeaders}
diff --git a/src/Listing/ListingLoader.test.jsx b/src/Listing/ListingLoader.test.jsx
index 5993403..897a694 100644
--- a/src/Listing/ListingLoader.test.jsx
+++ b/src/Listing/ListingLoader.test.jsx
@@ -1,11 +1,11 @@
 import React from 'react'
-import { mount } from 'enzyme'
+import { shallow } from 'enzyme'
 import { Table } from '@material-ui/core'
 
 import ListingLoader from './ListingLoader'
 
 it('renders correctly', () => {
-  const tree = mount((
+  const tree = shallow((
     <Table>
       <ListingLoader cols={1} />
     </Table>
diff --git a/src/Listing/ListingSearch.test.jsx b/src/Listing/ListingSearch.test.jsx
index ef82af9..1d277e0 100644
--- a/src/Listing/ListingSearch.test.jsx
+++ b/src/Listing/ListingSearch.test.jsx
@@ -1,5 +1,5 @@
 import React from 'react'
-import Enzyme, { mount } from 'enzyme'
+import Enzyme, { shallow } from 'enzyme'
 import Adapter from 'enzyme-adapter-react-16'
 
 import { IconButton } from '@material-ui/core'
@@ -8,7 +8,7 @@ import ListingSearch from './ListingSearch'
 Enzyme.configure({ adapter: new Adapter() })
 
 it('renders correctly', () => {
-  const tree = mount((
+  const tree = shallow((
     <ListingSearch
       onClick={() => { }}
       onFilter={() => { }}
@@ -19,7 +19,7 @@ it('renders correctly', () => {
 })
 
 it('renders correctly when open', () => {
-  const tree = mount((
+  const tree = shallow((
     <ListingSearch
       open
       onClick={() => { }}
@@ -31,7 +31,7 @@ it('renders correctly when open', () => {
 })
 
 it('opens if click is triggered', () => {
-  const listingSearch = mount((
+  const listingSearch = shallow((
     <ListingSearch
       open
       onClick={() => { }}
@@ -48,7 +48,7 @@ it('opens if click is triggered', () => {
 
 it('filters if open and value changes', () => {
   const onFilter = jest.fn()
-  const listingSearch = mount((
+  const listingSearch = shallow((
     <ListingSearch
       open
       onClick={() => { }}
@@ -63,7 +63,7 @@ it('filters if open and value changes', () => {
 
 it('does not filter if not open and value changes', () => {
   const onFilter = jest.fn()
-  const listingSearch = mount((
+  const listingSearch = shallow((
     <ListingSearch
       open
       onClick={() => { }}
@@ -86,7 +86,7 @@ it('focuses search field on click', () => {
     focus: jest.fn(),
   }
 
-  const listingSearch = mount((
+  const listingSearch = shallow((
     <ListingSearch
       onClick={() => { }}
       onFilter={() => {}}
diff --git a/src/Listing/ListingToolbar.test.jsx b/src/Listing/ListingToolbar.test.jsx
index 6fa522e..eb8923c 100644
--- a/src/Listing/ListingToolbar.test.jsx
+++ b/src/Listing/ListingToolbar.test.jsx
@@ -1,10 +1,10 @@
 import React from 'react'
-import { mount } from 'enzyme'
+import { shallow } from 'enzyme'
 
 import ListingToolbar from './ListingToolbar'
 
 it('renders correctly', () => {
-  const tree = mount((
+  const tree = shallow((
     <ListingToolbar
       title=""
       numSelected={0}
diff --git a/src/Listing/__snapshots__/Listing.test.jsx.snap b/src/Listing/__snapshots__/Listing.test.jsx.snap
index 05893fe..7277890 100644
--- a/src/Listing/__snapshots__/Listing.test.jsx.snap
+++ b/src/Listing/__snapshots__/Listing.test.jsx.snap
@@ -2,2944 +2,656 @@
 
 exports[`Listing renders correctly 1`] = `
 <div>
-  <div
-    className="MuiPaper-root-4 MuiPaper-elevation4-10 MuiPaper-rounded-5 ListingBranch-root-1"
-  >
-    <div
-      className="MuiToolbar-root-36 MuiToolbar-regular-38 MuiToolbar-gutters-37 ListingToolbar-root-31"
-    >
-      <div
-        className="ListingToolbar-title-35"
-      >
-        <h6
-          className="MuiTypography-root-40 MuiTypography-h6-57"
-        >
-          Christmas Time
-        </h6>
-      </div>
-      <div
-        className="ListingToolbar-spacer-33"
-      />
-      <div
-        className="ListingToolbar-actions-34"
-      >
-        <div
-          className="ListingSearchBranch-root-76"
-        >
-          <div
-            className="MuiFormControl-root-79 ListingSearchBranch-field-77"
-          >
-            <div
-              className="MuiInputBase-root-96 MuiInput-root-83 MuiInput-underline-87 MuiInputBase-formControl-97 MuiInput-formControl-84"
-              onClick={[Function]}
-            >
-              <input
-                aria-invalid={false}
-                className="MuiInputBase-input-106 MuiInput-input-91 MuiInputBase-inputType-109 MuiInput-inputType-94 MuiInputBase-inputTypeSearch-110 MuiInput-inputTypeSearch-95"
-                disabled={false}
-                onBlur={[Function]}
-                onChange={[Function]}
-                onFocus={[Function]}
-                placeholder="Filter"
-                required={false}
-                type="search"
-              />
-            </div>
-          </div>
-          Array [
-            <button
-              aria-describedby={null}
-              className="MuiButtonBase-root-127 MuiIconButton-root-121"
-              disabled={false}
-              onBlur={[Function]}
-              onClick={[Function]}
-              onContextMenu={[Function]}
-              onFocus={[Function]}
-              onKeyDown={[Function]}
-              onKeyUp={[Function]}
-              onMouseDown={[Function]}
-              onMouseLeave={[Function]}
-              onMouseOver={[Function]}
-              onMouseUp={[Function]}
-              onTouchEnd={[Function]}
-              onTouchMove={[Function]}
-              onTouchStart={[Function]}
-              tabIndex="0"
-              title="Search"
-              type="button"
-            >
-              <span
-                className="MuiIconButton-label-126"
-              >
-                <svg
-                  aria-hidden="true"
-                  className="MuiSvgIcon-root-130"
-                  focusable="false"
-                  role="presentation"
-                  viewBox="0 0 24 24"
-                >
-                  <path
-                    d="M15.5 14h-.79l-.28-.27C15.41 12.59 16 11.11 16 9.5 16 5.91 13.09 3 9.5 3S3 5.91 3 9.5 5.91 16 9.5 16c1.61 0 3.09-.59 4.23-1.57l.27.28v.79l5 4.99L20.49 19l-4.99-5zm-6 0C7.01 14 5 11.99 5 9.5S7.01 5 9.5 5 14 7.01 14 9.5 11.99 14 9.5 14z"
-                  />
-                  <path
-                    d="M0 0h24v24H0z"
-                    fill="none"
-                  />
-                </svg>
-              </span>
-              <span
-                className="MuiTouchRipple-root-196"
-              />
-            </button>,
-            "",
-          ]
-        </div>
-      </div>
-    </div>
-    <div
-      className="ListingBranch-tableWrapper-3"
-    >
-      <table
-        className="MuiTable-root-139 ListingBranch-table-2"
-      >
-        <thead
-          className="MuiTableHead-root-140"
-        >
-          <tr
-            className="MuiTableRow-root-141 MuiTableRow-head-144"
-          >
-            <th
-              aria-sort={null}
-              className="MuiTableCell-root-146 MuiTableCell-head-147 MuiTableCell-paddingCheckbox-152"
-              scope="col"
-            >
-              <span
-                className="MuiButtonBase-root-127 MuiIconButton-root-121 MuiPrivateSwitchBase-root-164 MuiCheckbox-root-158 MuiCheckbox-colorPrimary-162"
-                onBlur={[Function]}
-                onContextMenu={[Function]}
-                onFocus={[Function]}
-                onKeyDown={[Function]}
-                onKeyUp={[Function]}
-                onMouseDown={[Function]}
-                onMouseLeave={[Function]}
-                onMouseUp={[Function]}
-                onTouchEnd={[Function]}
-                onTouchMove={[Function]}
-                onTouchStart={[Function]}
-                tabIndex={null}
-              >
-                <span
-                  className="MuiIconButton-label-126"
-                >
-                  <svg
-                    aria-hidden="true"
-                    className="MuiSvgIcon-root-130"
-                    focusable="false"
-                    role="presentation"
-                    viewBox="0 0 24 24"
-                  >
-                    <path
-                      d="M19 5v14H5V5h14m0-2H5c-1.1 0-2 .9-2 2v14c0 1.1.9 2 2 2h14c1.1 0 2-.9 2-2V5c0-1.1-.9-2-2-2z"
-                    />
-                  </svg>
-                  <input
-                    checked={false}
-                    className="MuiPrivateSwitchBase-input-167"
-                    data-indeterminate={false}
-                    onChange={[Function]}
-                    type="checkbox"
-                  />
-                </span>
-                <span
-                  className="MuiTouchRipple-root-196"
-                />
-              </span>
-            </th>
-            <th
-              aria-sort={null}
-              className="MuiTableCell-root-146 MuiTableCell-head-147 MuiTableCell-paddingNone-153"
-              scope="col"
-            >
-              Array [
-                <span
-                  aria-describedby={null}
-                  className="MuiButtonBase-root-127 MuiTableSortLabel-root-168"
-                  onBlur={[Function]}
-                  onClick={[Function]}
-                  onContextMenu={[Function]}
-                  onFocus={[Function]}
-                  onKeyDown={[Function]}
-                  onKeyUp={[Function]}
-                  onMouseDown={[Function]}
-                  onMouseLeave={[Function]}
-                  onMouseOver={[Function]}
-                  onMouseUp={[Function]}
-                  onTouchEnd={[Function]}
-                  onTouchMove={[Function]}
-                  onTouchStart={[Function]}
-                  role="button"
-                  tabIndex="0"
-                  title="Sort"
-                >
-                  Name
-                  <svg
-                    aria-hidden="true"
-                    className="MuiSvgIcon-root-130 MuiTableSortLabel-icon-170 MuiTableSortLabel-iconDirectionAsc-172"
-                    focusable="false"
-                    role="presentation"
-                    viewBox="0 0 24 24"
-                  >
-                    <path
-                      d="M20 12l-1.41-1.41L13 16.17V4h-2v12.17l-5.58-5.59L4 12l8 8 8-8z"
-                    />
-                  </svg>
-                </span>,
-                "",
-              ]
-            </th>
-            <th
-              aria-sort={null}
-              className="MuiTableCell-root-146 MuiTableCell-head-147 MuiTableCell-paddingNone-153"
-              scope="col"
-            >
-              Array [
-                <span
-                  aria-describedby={null}
-                  className="MuiButtonBase-root-127 MuiTableSortLabel-root-168 MuiTableSortLabel-active-169"
-                  onBlur={[Function]}
-                  onClick={[Function]}
-                  onContextMenu={[Function]}
-                  onFocus={[Function]}
-                  onKeyDown={[Function]}
-                  onKeyUp={[Function]}
-                  onMouseDown={[Function]}
-                  onMouseLeave={[Function]}
-                  onMouseOver={[Function]}
-                  onMouseUp={[Function]}
-                  onTouchEnd={[Function]}
-                  onTouchMove={[Function]}
-                  onTouchStart={[Function]}
-                  role="button"
-                  tabIndex="0"
-                  title="Sort"
-                >
-                  Username
-                  <svg
-                    aria-hidden="true"
-                    className="MuiSvgIcon-root-130 MuiTableSortLabel-icon-170 MuiTableSortLabel-iconDirectionAsc-172"
-                    focusable="false"
-                    role="presentation"
-                    viewBox="0 0 24 24"
-                  >
-                    <path
-                      d="M20 12l-1.41-1.41L13 16.17V4h-2v12.17l-5.58-5.59L4 12l8 8 8-8z"
-                    />
-                  </svg>
-                </span>,
-                "",
-              ]
-            </th>
-            <th
-              aria-sort={null}
-              className="MuiTableCell-root-146 MuiTableCell-head-147 MuiTableCell-alignRight-156"
-              scope="col"
-            >
-              Array [
-                <span
-                  aria-describedby={null}
-                  className="MuiButtonBase-root-127 MuiTableSortLabel-root-168"
-                  onBlur={[Function]}
-                  onClick={[Function]}
-                  onContextMenu={[Function]}
-                  onFocus={[Function]}
-                  onKeyDown={[Function]}
-                  onKeyUp={[Function]}
-                  onMouseDown={[Function]}
-                  onMouseLeave={[Function]}
-                  onMouseOver={[Function]}
-                  onMouseUp={[Function]}
-                  onTouchEnd={[Function]}
-                  onTouchMove={[Function]}
-                  onTouchStart={[Function]}
-                  role="button"
-                  tabIndex="0"
-                  title="Sort"
-                >
-                  Phone
-                  <svg
-                    aria-hidden="true"
-                    className="MuiSvgIcon-root-130 MuiTableSortLabel-icon-170 MuiTableSortLabel-iconDirectionAsc-172"
-                    focusable="false"
-                    role="presentation"
-                    viewBox="0 0 24 24"
-                  >
-                    <path
-                      d="M20 12l-1.41-1.41L13 16.17V4h-2v12.17l-5.58-5.59L4 12l8 8 8-8z"
-                    />
-                  </svg>
-                </span>,
-                "",
-              ]
-            </th>
-            <th
-              aria-sort={null}
-              className="MuiTableCell-root-146 MuiTableCell-head-147 MuiTableCell-paddingNone-153"
-              scope="col"
-            >
-              Array [
-                <span
-                  aria-describedby={null}
-                  className="MuiButtonBase-root-127 MuiTableSortLabel-root-168"
-                  onBlur={[Function]}
-                  onClick={[Function]}
-                  onContextMenu={[Function]}
-                  onFocus={[Function]}
-                  onKeyDown={[Function]}
-                  onKeyUp={[Function]}
-                  onMouseDown={[Function]}
-                  onMouseLeave={[Function]}
-                  onMouseOver={[Function]}
-                  onMouseUp={[Function]}
-                  onTouchEnd={[Function]}
-                  onTouchMove={[Function]}
-                  onTouchStart={[Function]}
-                  role="button"
-                  tabIndex="0"
-                  title="Sort"
-                >
-                  Website
-                  <svg
-                    aria-hidden="true"
-                    className="MuiSvgIcon-root-130 MuiTableSortLabel-icon-170 MuiTableSortLabel-iconDirectionAsc-172"
-                    focusable="false"
-                    role="presentation"
-                    viewBox="0 0 24 24"
-                  >
-                    <path
-                      d="M20 12l-1.41-1.41L13 16.17V4h-2v12.17l-5.58-5.59L4 12l8 8 8-8z"
-                    />
-                  </svg>
-                </span>,
-                "",
-              ]
-            </th>
-            <th
-              aria-sort={null}
-              className="MuiTableCell-root-146 MuiTableCell-head-147 MuiTableCell-paddingNone-153"
-              scope="col"
-            >
-              Array [
-                <span
-                  aria-describedby={null}
-                  className="MuiButtonBase-root-127 MuiTableSortLabel-root-168"
-                  onBlur={[Function]}
-                  onClick={[Function]}
-                  onContextMenu={[Function]}
-                  onFocus={[Function]}
-                  onKeyDown={[Function]}
-                  onKeyUp={[Function]}
-                  onMouseDown={[Function]}
-                  onMouseLeave={[Function]}
-                  onMouseOver={[Function]}
-                  onMouseUp={[Function]}
-                  onTouchEnd={[Function]}
-                  onTouchMove={[Function]}
-                  onTouchStart={[Function]}
-                  role="button"
-                  tabIndex="0"
-                  title="Sort"
-                >
-                  Company
-                  <svg
-                    aria-hidden="true"
-                    className="MuiSvgIcon-root-130 MuiTableSortLabel-icon-170 MuiTableSortLabel-iconDirectionAsc-172"
-                    focusable="false"
-                    role="presentation"
-                    viewBox="0 0 24 24"
-                  >
-                    <path
-                      d="M20 12l-1.41-1.41L13 16.17V4h-2v12.17l-5.58-5.59L4 12l8 8 8-8z"
-                    />
-                  </svg>
-                </span>,
-                "",
-              ]
-            </th>
-          </tr>
-        </thead>
-        <tbody
-          className="MuiTableBody-root-173"
-        >
-          <tr
-            aria-checked={false}
-            className="MuiTableRow-root-141 MuiTableRow-hover-143"
-            onKeyDown={[Function]}
-            role="checkbox"
-            tabIndex={-1}
-          >
-            <td
-              aria-sort={null}
-              className="MuiTableCell-root-146 MuiTableCell-body-148 MuiTableCell-paddingCheckbox-152"
-              onClick={[Function]}
-            >
-              <span
-                className="MuiButtonBase-root-127 MuiIconButton-root-121 MuiPrivateSwitchBase-root-164 MuiCheckbox-root-158 MuiCheckbox-colorPrimary-162"
-                onBlur={[Function]}
-                onContextMenu={[Function]}
-                onFocus={[Function]}
-                onKeyDown={[Function]}
-                onKeyUp={[Function]}
-                onMouseDown={[Function]}
-                onMouseLeave={[Function]}
-                onMouseUp={[Function]}
-                onTouchEnd={[Function]}
-                onTouchMove={[Function]}
-                onTouchStart={[Function]}
-                tabIndex={null}
-              >
-                <span
-                  className="MuiIconButton-label-126"
-                >
-                  <svg
-                    aria-hidden="true"
-                    className="MuiSvgIcon-root-130"
-                    focusable="false"
-                    role="presentation"
-                    viewBox="0 0 24 24"
-                  >
-                    <path
-                      d="M19 5v14H5V5h14m0-2H5c-1.1 0-2 .9-2 2v14c0 1.1.9 2 2 2h14c1.1 0 2-.9 2-2V5c0-1.1-.9-2-2-2z"
-                    />
-                  </svg>
-                  <input
-                    checked={false}
-                    className="MuiPrivateSwitchBase-input-167"
-                    data-indeterminate={false}
-                    onChange={[Function]}
-                    type="checkbox"
-                  />
-                </span>
-                <span
-                  className="MuiTouchRipple-root-196"
-                />
-              </span>
-            </td>
-            <td
-              aria-sort={null}
-              className="MuiTableCell-root-146 MuiTableCell-body-148 MuiTableCell-paddingNone-153"
-              onClick={[Function]}
-            >
-              Ervin Howell
-            </td>
-            <td
-              aria-sort={null}
-              className="MuiTableCell-root-146 MuiTableCell-body-148 MuiTableCell-paddingNone-153"
-              onClick={[Function]}
-            >
-              Antonette
-            </td>
-            <td
-              aria-sort={null}
-              className="MuiTableCell-root-146 MuiTableCell-body-148 MuiTableCell-alignRight-156"
-              onClick={[Function]}
-            >
-              010-692-6593 x09125
-            </td>
-            <td
-              aria-sort={null}
-              className="MuiTableCell-root-146 MuiTableCell-body-148 MuiTableCell-paddingNone-153"
-              onClick={[Function]}
-            >
-              <a
-                href="http://anastasia.net"
-              >
-                anastasia.net
-              </a>
-            </td>
-            <td
-              aria-sort={null}
-              className="MuiTableCell-root-146 MuiTableCell-body-148 MuiTableCell-paddingNone-153"
-              onClick={[Function]}
-            >
-              Deckow-Crist
-            </td>
-          </tr>
-          <tr
-            aria-checked={false}
-            className="MuiTableRow-root-141 MuiTableRow-hover-143"
-            onKeyDown={[Function]}
-            role="checkbox"
-            tabIndex={-1}
-          >
-            <td
-              aria-sort={null}
-              className="MuiTableCell-root-146 MuiTableCell-body-148 MuiTableCell-paddingCheckbox-152"
-              onClick={[Function]}
-            >
-              <span
-                className="MuiButtonBase-root-127 MuiIconButton-root-121 MuiPrivateSwitchBase-root-164 MuiCheckbox-root-158 MuiCheckbox-colorPrimary-162"
-                onBlur={[Function]}
-                onContextMenu={[Function]}
-                onFocus={[Function]}
-                onKeyDown={[Function]}
-                onKeyUp={[Function]}
-                onMouseDown={[Function]}
-                onMouseLeave={[Function]}
-                onMouseUp={[Function]}
-                onTouchEnd={[Function]}
-                onTouchMove={[Function]}
-                onTouchStart={[Function]}
-                tabIndex={null}
-              >
-                <span
-                  className="MuiIconButton-label-126"
-                >
-                  <svg
-                    aria-hidden="true"
-                    className="MuiSvgIcon-root-130"
-                    focusable="false"
-                    role="presentation"
-                    viewBox="0 0 24 24"
-                  >
-                    <path
-                      d="M19 5v14H5V5h14m0-2H5c-1.1 0-2 .9-2 2v14c0 1.1.9 2 2 2h14c1.1 0 2-.9 2-2V5c0-1.1-.9-2-2-2z"
-                    />
-                  </svg>
-                  <input
-                    checked={false}
-                    className="MuiPrivateSwitchBase-input-167"
-                    data-indeterminate={false}
-                    onChange={[Function]}
-                    type="checkbox"
-                  />
-                </span>
-                <span
-                  className="MuiTouchRipple-root-196"
-                />
-              </span>
-            </td>
-            <td
-              aria-sort={null}
-              className="MuiTableCell-root-146 MuiTableCell-body-148 MuiTableCell-paddingNone-153"
-              onClick={[Function]}
-            >
-              Leanne Graham
-            </td>
-            <td
-              aria-sort={null}
-              className="MuiTableCell-root-146 MuiTableCell-body-148 MuiTableCell-paddingNone-153"
-              onClick={[Function]}
-            >
-              Bret
-            </td>
-            <td
-              aria-sort={null}
-              className="MuiTableCell-root-146 MuiTableCell-body-148 MuiTableCell-alignRight-156"
-              onClick={[Function]}
-            >
-              1-770-736-8031 x56442
-            </td>
-            <td
-              aria-sort={null}
-              className="MuiTableCell-root-146 MuiTableCell-body-148 MuiTableCell-paddingNone-153"
-              onClick={[Function]}
-            >
-              <a
-                href="http://hildegard.org"
-              >
-                hildegard.org
-              </a>
-            </td>
-            <td
-              aria-sort={null}
-              className="MuiTableCell-root-146 MuiTableCell-body-148 MuiTableCell-paddingNone-153"
-              onClick={[Function]}
-            >
-              Romaguera-Crona
-            </td>
-          </tr>
-          <tr
-            aria-checked={false}
-            className="MuiTableRow-root-141 MuiTableRow-hover-143"
-            onKeyDown={[Function]}
-            role="checkbox"
-            tabIndex={-1}
-          >
-            <td
-              aria-sort={null}
-              className="MuiTableCell-root-146 MuiTableCell-body-148 MuiTableCell-paddingCheckbox-152"
-              onClick={[Function]}
-            >
-              <span
-                className="MuiButtonBase-root-127 MuiIconButton-root-121 MuiPrivateSwitchBase-root-164 MuiCheckbox-root-158 MuiCheckbox-colorPrimary-162"
-                onBlur={[Function]}
-                onContextMenu={[Function]}
-                onFocus={[Function]}
-                onKeyDown={[Function]}
-                onKeyUp={[Function]}
-                onMouseDown={[Function]}
-                onMouseLeave={[Function]}
-                onMouseUp={[Function]}
-                onTouchEnd={[Function]}
-                onTouchMove={[Function]}
-                onTouchStart={[Function]}
-                tabIndex={null}
-              >
-                <span
-                  className="MuiIconButton-label-126"
-                >
-                  <svg
-                    aria-hidden="true"
-                    className="MuiSvgIcon-root-130"
-                    focusable="false"
-                    role="presentation"
-                    viewBox="0 0 24 24"
-                  >
-                    <path
-                      d="M19 5v14H5V5h14m0-2H5c-1.1 0-2 .9-2 2v14c0 1.1.9 2 2 2h14c1.1 0 2-.9 2-2V5c0-1.1-.9-2-2-2z"
-                    />
-                  </svg>
-                  <input
-                    checked={false}
-                    className="MuiPrivateSwitchBase-input-167"
-                    data-indeterminate={false}
-                    onChange={[Function]}
-                    type="checkbox"
-                  />
-                </span>
-                <span
-                  className="MuiTouchRipple-root-196"
-                />
-              </span>
-            </td>
-            <td
-              aria-sort={null}
-              className="MuiTableCell-root-146 MuiTableCell-body-148 MuiTableCell-paddingNone-153"
-              onClick={[Function]}
-            >
-              Mr. Dan Schulist
-            </td>
-            <td
-              aria-sort={null}
-              className="MuiTableCell-root-146 MuiTableCell-body-148 MuiTableCell-paddingNone-153"
-              onClick={[Function]}
-            >
-              Dan.Schulist
-            </td>
-            <td
-              aria-sort={null}
-              className="MuiTableCell-root-146 MuiTableCell-body-148 MuiTableCell-alignRight-156"
-              onClick={[Function]}
-            >
-              024-648-3804
-            </td>
-            <td
-              aria-sort={null}
-              className="MuiTableCell-root-146 MuiTableCell-body-148 MuiTableCell-paddingNone-153"
-              onClick={[Function]}
-            >
-              <a
-                href="http://ambrose.net"
-              >
-                ambrose.net
-              </a>
-            </td>
-            <td
-              aria-sort={null}
-              className="MuiTableCell-root-146 MuiTableCell-body-148 MuiTableCell-paddingNone-153"
-              onClick={[Function]}
-            >
-              Hoeger LLC
-            </td>
-          </tr>
-          <tr
-            aria-checked={false}
-            className="MuiTableRow-root-141 MuiTableRow-hover-143"
-            onKeyDown={[Function]}
-            role="checkbox"
-            tabIndex={-1}
-          >
-            <td
-              aria-sort={null}
-              className="MuiTableCell-root-146 MuiTableCell-body-148 MuiTableCell-paddingCheckbox-152"
-              onClick={[Function]}
-            >
-              <span
-                className="MuiButtonBase-root-127 MuiIconButton-root-121 MuiPrivateSwitchBase-root-164 MuiCheckbox-root-158 MuiCheckbox-colorPrimary-162"
-                onBlur={[Function]}
-                onContextMenu={[Function]}
-                onFocus={[Function]}
-                onKeyDown={[Function]}
-                onKeyUp={[Function]}
-                onMouseDown={[Function]}
-                onMouseLeave={[Function]}
-                onMouseUp={[Function]}
-                onTouchEnd={[Function]}
-                onTouchMove={[Function]}
-                onTouchStart={[Function]}
-                tabIndex={null}
-              >
-                <span
-                  className="MuiIconButton-label-126"
-                >
-                  <svg
-                    aria-hidden="true"
-                    className="MuiSvgIcon-root-130"
-                    focusable="false"
-                    role="presentation"
-                    viewBox="0 0 24 24"
-                  >
-                    <path
-                      d="M19 5v14H5V5h14m0-2H5c-1.1 0-2 .9-2 2v14c0 1.1.9 2 2 2h14c1.1 0 2-.9 2-2V5c0-1.1-.9-2-2-2z"
-                    />
-                  </svg>
-                  <input
-                    checked={false}
-                    className="MuiPrivateSwitchBase-input-167"
-                    data-indeterminate={false}
-                    onChange={[Function]}
-                    type="checkbox"
-                  />
-                </span>
-                <span
-                  className="MuiTouchRipple-root-196"
-                />
-              </span>
-            </td>
-            <td
-              aria-sort={null}
-              className="MuiTableCell-root-146 MuiTableCell-body-148 MuiTableCell-paddingNone-153"
-              onClick={[Function]}
-            >
-              Glenna Reichert
-            </td>
-            <td
-              aria-sort={null}
-              className="MuiTableCell-root-146 MuiTableCell-body-148 MuiTableCell-paddingNone-153"
-              onClick={[Function]}
-            >
-              Delphine
-            </td>
-            <td
-              aria-sort={null}
-              className="MuiTableCell-root-146 MuiTableCell-body-148 MuiTableCell-alignRight-156"
-              onClick={[Function]}
-            >
-              (775)976-6794 x41206
-            </td>
-            <td
-              aria-sort={null}
-              className="MuiTableCell-root-146 MuiTableCell-body-148 MuiTableCell-paddingNone-153"
-              onClick={[Function]}
-            >
-              <a
-                href="http://conrad.com"
-              >
-                conrad.com
-              </a>
-            </td>
-            <td
-              aria-sort={null}
-              className="MuiTableCell-root-146 MuiTableCell-body-148 MuiTableCell-paddingNone-153"
-              onClick={[Function]}
-            >
-              Yost and Sons
-            </td>
-          </tr>
-          <tr
-            aria-checked={false}
-            className="MuiTableRow-root-141 MuiTableRow-hover-143"
-            onKeyDown={[Function]}
-            role="checkbox"
-            tabIndex={-1}
-          >
-            <td
-              aria-sort={null}
-              className="MuiTableCell-root-146 MuiTableCell-body-148 MuiTableCell-paddingCheckbox-152"
-              onClick={[Function]}
-            >
-              <span
-                className="MuiButtonBase-root-127 MuiIconButton-root-121 MuiPrivateSwitchBase-root-164 MuiCheckbox-root-158 MuiCheckbox-colorPrimary-162"
-                onBlur={[Function]}
-                onContextMenu={[Function]}
-                onFocus={[Function]}
-                onKeyDown={[Function]}
-                onKeyUp={[Function]}
-                onMouseDown={[Function]}
-                onMouseLeave={[Function]}
-                onMouseUp={[Function]}
-                onTouchEnd={[Function]}
-                onTouchMove={[Function]}
-                onTouchStart={[Function]}
-                tabIndex={null}
-              >
-                <span
-                  className="MuiIconButton-label-126"
-                >
-                  <svg
-                    aria-hidden="true"
-                    className="MuiSvgIcon-root-130"
-                    focusable="false"
-                    role="presentation"
-                    viewBox="0 0 24 24"
-                  >
-                    <path
-                      d="M19 5v14H5V5h14m0-2H5c-1.1 0-2 .9-2 2v14c0 1.1.9 2 2 2h14c1.1 0 2-.9 2-2V5c0-1.1-.9-2-2-2z"
-                    />
-                  </svg>
-                  <input
-                    checked={false}
-                    className="MuiPrivateSwitchBase-input-167"
-                    data-indeterminate={false}
-                    onChange={[Function]}
-                    type="checkbox"
-                  />
-                </span>
-                <span
-                  className="MuiTouchRipple-root-196"
-                />
-              </span>
-            </td>
-            <td
-              aria-sort={null}
-              className="MuiTableCell-root-146 MuiTableCell-body-148 MuiTableCell-paddingNone-153"
-              onClick={[Function]}
-            >
-              Kurtis Weissnat
-            </td>
-            <td
-              aria-sort={null}
-              className="MuiTableCell-root-146 MuiTableCell-body-148 MuiTableCell-paddingNone-153"
-              onClick={[Function]}
-            >
-              Elwyn.Skiles
-            </td>
-            <td
-              aria-sort={null}
-              className="MuiTableCell-root-146 MuiTableCell-body-148 MuiTableCell-alignRight-156"
-              onClick={[Function]}
-            >
-              210.067.6132
-            </td>
-            <td
-              aria-sort={null}
-              className="MuiTableCell-root-146 MuiTableCell-body-148 MuiTableCell-paddingNone-153"
-              onClick={[Function]}
-            >
-              <a
-                href="http://elvis.io"
-              >
-                elvis.io
-              </a>
-            </td>
-            <td
-              aria-sort={null}
-              className="MuiTableCell-root-146 MuiTableCell-body-148 MuiTableCell-paddingNone-153"
-              onClick={[Function]}
-            >
-              Johns Group
-            </td>
-          </tr>
-          <tr
-            aria-checked={false}
-            className="MuiTableRow-root-141 MuiTableRow-hover-143"
-            onKeyDown={[Function]}
-            role="checkbox"
-            tabIndex={-1}
-          >
-            <td
-              aria-sort={null}
-              className="MuiTableCell-root-146 MuiTableCell-body-148 MuiTableCell-paddingCheckbox-152"
-              onClick={[Function]}
-            >
-              <span
-                className="MuiButtonBase-root-127 MuiIconButton-root-121 MuiPrivateSwitchBase-root-164 MuiCheckbox-root-158 MuiCheckbox-colorPrimary-162"
-                onBlur={[Function]}
-                onContextMenu={[Function]}
-                onFocus={[Function]}
-                onKeyDown={[Function]}
-                onKeyUp={[Function]}
-                onMouseDown={[Function]}
-                onMouseLeave={[Function]}
-                onMouseUp={[Function]}
-                onTouchEnd={[Function]}
-                onTouchMove={[Function]}
-                onTouchStart={[Function]}
-                tabIndex={null}
-              >
-                <span
-                  className="MuiIconButton-label-126"
-                >
-                  <svg
-                    aria-hidden="true"
-                    className="MuiSvgIcon-root-130"
-                    focusable="false"
-                    role="presentation"
-                    viewBox="0 0 24 24"
-                  >
-                    <path
-                      d="M19 5v14H5V5h14m0-2H5c-1.1 0-2 .9-2 2v14c0 1.1.9 2 2 2h14c1.1 0 2-.9 2-2V5c0-1.1-.9-2-2-2z"
-                    />
-                  </svg>
-                  <input
-                    checked={false}
-                    className="MuiPrivateSwitchBase-input-167"
-                    data-indeterminate={false}
-                    onChange={[Function]}
-                    type="checkbox"
-                  />
-                </span>
-                <span
-                  className="MuiTouchRipple-root-196"
-                />
-              </span>
-            </td>
-            <td
-              aria-sort={null}
-              className="MuiTableCell-root-146 MuiTableCell-body-148 MuiTableCell-paddingNone-153"
-              onClick={[Function]}
-            >
-              Chelsey Dietrich
-            </td>
-            <td
-              aria-sort={null}
-              className="MuiTableCell-root-146 MuiTableCell-body-148 MuiTableCell-paddingNone-153"
-              onClick={[Function]}
-            >
-              Kamren
-            </td>
-            <td
-              aria-sort={null}
-              className="MuiTableCell-root-146 MuiTableCell-body-148 MuiTableCell-alignRight-156"
-              onClick={[Function]}
-            >
-              (254)954-1289
-            </td>
-            <td
-              aria-sort={null}
-              className="MuiTableCell-root-146 MuiTableCell-body-148 MuiTableCell-paddingNone-153"
-              onClick={[Function]}
-            >
-              <a
-                href="http://demarco.info"
-              >
-                demarco.info
-              </a>
-            </td>
-            <td
-              aria-sort={null}
-              className="MuiTableCell-root-146 MuiTableCell-body-148 MuiTableCell-paddingNone-153"
-              onClick={[Function]}
-            >
-              Keebler LLC
-            </td>
-          </tr>
-          <tr
-            aria-checked={false}
-            className="MuiTableRow-root-141 MuiTableRow-hover-143"
-            onKeyDown={[Function]}
-            role="checkbox"
-            tabIndex={-1}
-          >
-            <td
-              aria-sort={null}
-              className="MuiTableCell-root-146 MuiTableCell-body-148 MuiTableCell-paddingCheckbox-152"
-              onClick={[Function]}
-            >
-              <span
-                className="MuiButtonBase-root-127 MuiIconButton-root-121 MuiPrivateSwitchBase-root-164 MuiCheckbox-root-158 MuiCheckbox-colorPrimary-162"
-                onBlur={[Function]}
-                onContextMenu={[Function]}
-                onFocus={[Function]}
-                onKeyDown={[Function]}
-                onKeyUp={[Function]}
-                onMouseDown={[Function]}
-                onMouseLeave={[Function]}
-                onMouseUp={[Function]}
-                onTouchEnd={[Function]}
-                onTouchMove={[Function]}
-                onTouchStart={[Function]}
-                tabIndex={null}
-              >
-                <span
-                  className="MuiIconButton-label-126"
-                >
-                  <svg
-                    aria-hidden="true"
-                    className="MuiSvgIcon-root-130"
-                    focusable="false"
-                    role="presentation"
-                    viewBox="0 0 24 24"
-                  >
-                    <path
-                      d="M19 5v14H5V5h14m0-2H5c-1.1 0-2 .9-2 2v14c0 1.1.9 2 2 2h14c1.1 0 2-.9 2-2V5c0-1.1-.9-2-2-2z"
-                    />
-                  </svg>
-                  <input
-                    checked={false}
-                    className="MuiPrivateSwitchBase-input-167"
-                    data-indeterminate={false}
-                    onChange={[Function]}
-                    type="checkbox"
-                  />
-                </span>
-                <span
-                  className="MuiTouchRipple-root-196"
-                />
-              </span>
-            </td>
-            <td
-              aria-sort={null}
-              className="MuiTableCell-root-146 MuiTableCell-body-148 MuiTableCell-paddingNone-153"
-              onClick={[Function]}
-            >
-              Patricia Lebsack
-            </td>
-            <td
-              aria-sort={null}
-              className="MuiTableCell-root-146 MuiTableCell-body-148 MuiTableCell-paddingNone-153"
-              onClick={[Function]}
-            >
-              Karianne
-            </td>
-            <td
-              aria-sort={null}
-              className="MuiTableCell-root-146 MuiTableCell-body-148 MuiTableCell-alignRight-156"
-              onClick={[Function]}
-            >
-              493-170-9623 x156
-            </td>
-            <td
-              aria-sort={null}
-              className="MuiTableCell-root-146 MuiTableCell-body-148 MuiTableCell-paddingNone-153"
-              onClick={[Function]}
-            >
-              <a
-                href="http://kale.biz"
-              >
-                kale.biz
-              </a>
-            </td>
-            <td
-              aria-sort={null}
-              className="MuiTableCell-root-146 MuiTableCell-body-148 MuiTableCell-paddingNone-153"
-              onClick={[Function]}
-            >
-              Robel-Corkery
-            </td>
-          </tr>
-          <tr
-            aria-checked={false}
-            className="MuiTableRow-root-141 MuiTableRow-hover-143"
-            onKeyDown={[Function]}
-            role="checkbox"
-            tabIndex={-1}
-          >
-            <td
-              aria-sort={null}
-              className="MuiTableCell-root-146 MuiTableCell-body-148 MuiTableCell-paddingCheckbox-152"
-              onClick={[Function]}
-            >
-              <span
-                className="MuiButtonBase-root-127 MuiIconButton-root-121 MuiPrivateSwitchBase-root-164 MuiCheckbox-root-158 MuiCheckbox-colorPrimary-162"
-                onBlur={[Function]}
-                onContextMenu={[Function]}
-                onFocus={[Function]}
-                onKeyDown={[Function]}
-                onKeyUp={[Function]}
-                onMouseDown={[Function]}
-                onMouseLeave={[Function]}
-                onMouseUp={[Function]}
-                onTouchEnd={[Function]}
-                onTouchMove={[Function]}
-                onTouchStart={[Function]}
-                tabIndex={null}
-              >
-                <span
-                  className="MuiIconButton-label-126"
-                >
-                  <svg
-                    aria-hidden="true"
-                    className="MuiSvgIcon-root-130"
-                    focusable="false"
-                    role="presentation"
-                    viewBox="0 0 24 24"
-                  >
-                    <path
-                      d="M19 5v14H5V5h14m0-2H5c-1.1 0-2 .9-2 2v14c0 1.1.9 2 2 2h14c1.1 0 2-.9 2-2V5c0-1.1-.9-2-2-2z"
-                    />
-                  </svg>
-                  <input
-                    checked={false}
-                    className="MuiPrivateSwitchBase-input-167"
-                    data-indeterminate={false}
-                    onChange={[Function]}
-                    type="checkbox"
-                  />
-                </span>
-                <span
-                  className="MuiTouchRipple-root-196"
-                />
-              </span>
-            </td>
-            <td
-              aria-sort={null}
-              className="MuiTableCell-root-146 MuiTableCell-body-148 MuiTableCell-paddingNone-153"
-              onClick={[Function]}
-            >
-              Mrs. Dennis Schulist
-            </td>
-            <td
-              aria-sort={null}
-              className="MuiTableCell-root-146 MuiTableCell-body-148 MuiTableCell-paddingNone-153"
-              onClick={[Function]}
-            >
-              Leopoldo_Corkery
-            </td>
-            <td
-              aria-sort={null}
-              className="MuiTableCell-root-146 MuiTableCell-body-148 MuiTableCell-alignRight-156"
-              onClick={[Function]}
-            >
-              1-477-935-8478 x6430
-            </td>
-            <td
-              aria-sort={null}
-              className="MuiTableCell-root-146 MuiTableCell-body-148 MuiTableCell-paddingNone-153"
-              onClick={[Function]}
-            >
-              <a
-                href="http://ola.org"
-              >
-                ola.org
-              </a>
-            </td>
-            <td
-              aria-sort={null}
-              className="MuiTableCell-root-146 MuiTableCell-body-148 MuiTableCell-paddingNone-153"
-              onClick={[Function]}
-            >
-              Considine-Lockman
-            </td>
-          </tr>
-          <tr
-            aria-checked={false}
-            className="MuiTableRow-root-141 MuiTableRow-hover-143"
-            onKeyDown={[Function]}
-            role="checkbox"
-            tabIndex={-1}
-          >
-            <td
-              aria-sort={null}
-              className="MuiTableCell-root-146 MuiTableCell-body-148 MuiTableCell-paddingCheckbox-152"
-              onClick={[Function]}
-            >
-              <span
-                className="MuiButtonBase-root-127 MuiIconButton-root-121 MuiPrivateSwitchBase-root-164 MuiCheckbox-root-158 MuiCheckbox-colorPrimary-162"
-                onBlur={[Function]}
-                onContextMenu={[Function]}
-                onFocus={[Function]}
-                onKeyDown={[Function]}
-                onKeyUp={[Function]}
-                onMouseDown={[Function]}
-                onMouseLeave={[Function]}
-                onMouseUp={[Function]}
-                onTouchEnd={[Function]}
-                onTouchMove={[Function]}
-                onTouchStart={[Function]}
-                tabIndex={null}
-              >
-                <span
-                  className="MuiIconButton-label-126"
-                >
-                  <svg
-                    aria-hidden="true"
-                    className="MuiSvgIcon-root-130"
-                    focusable="false"
-                    role="presentation"
-                    viewBox="0 0 24 24"
-                  >
-                    <path
-                      d="M19 5v14H5V5h14m0-2H5c-1.1 0-2 .9-2 2v14c0 1.1.9 2 2 2h14c1.1 0 2-.9 2-2V5c0-1.1-.9-2-2-2z"
-                    />
-                  </svg>
-                  <input
-                    checked={false}
-                    className="MuiPrivateSwitchBase-input-167"
-                    data-indeterminate={false}
-                    onChange={[Function]}
-                    type="checkbox"
-                  />
-                </span>
-                <span
-                  className="MuiTouchRipple-root-196"
-                />
-              </span>
-            </td>
-            <td
-              aria-sort={null}
-              className="MuiTableCell-root-146 MuiTableCell-body-148 MuiTableCell-paddingNone-153"
-              onClick={[Function]}
-            >
-              Nicholas Runolfsdottir V
-            </td>
-            <td
-              aria-sort={null}
-              className="MuiTableCell-root-146 MuiTableCell-body-148 MuiTableCell-paddingNone-153"
-              onClick={[Function]}
-            >
-              Maxime_Nienow
-            </td>
-            <td
-              aria-sort={null}
-              className="MuiTableCell-root-146 MuiTableCell-body-148 MuiTableCell-alignRight-156"
-              onClick={[Function]}
-            >
-              586.493.6943 x140
-            </td>
-            <td
-              aria-sort={null}
-              className="MuiTableCell-root-146 MuiTableCell-body-148 MuiTableCell-paddingNone-153"
-              onClick={[Function]}
-            >
-              <a
-                href="http://jacynthe.com"
-              >
-                jacynthe.com
-              </a>
-            </td>
-            <td
-              aria-sort={null}
-              className="MuiTableCell-root-146 MuiTableCell-body-148 MuiTableCell-paddingNone-153"
-              onClick={[Function]}
-            >
-              Abernathy Group
-            </td>
-          </tr>
-          <tr
-            aria-checked={false}
-            className="MuiTableRow-root-141 MuiTableRow-hover-143"
-            onKeyDown={[Function]}
-            role="checkbox"
-            tabIndex={-1}
-          >
-            <td
-              aria-sort={null}
-              className="MuiTableCell-root-146 MuiTableCell-body-148 MuiTableCell-paddingCheckbox-152"
-              onClick={[Function]}
-            >
-              <span
-                className="MuiButtonBase-root-127 MuiIconButton-root-121 MuiPrivateSwitchBase-root-164 MuiCheckbox-root-158 MuiCheckbox-colorPrimary-162"
-                onBlur={[Function]}
-                onContextMenu={[Function]}
-                onFocus={[Function]}
-                onKeyDown={[Function]}
-                onKeyUp={[Function]}
-                onMouseDown={[Function]}
-                onMouseLeave={[Function]}
-                onMouseUp={[Function]}
-                onTouchEnd={[Function]}
-                onTouchMove={[Function]}
-                onTouchStart={[Function]}
-                tabIndex={null}
-              >
-                <span
-                  className="MuiIconButton-label-126"
-                >
-                  <svg
-                    aria-hidden="true"
-                    className="MuiSvgIcon-root-130"
-                    focusable="false"
-                    role="presentation"
-                    viewBox="0 0 24 24"
-                  >
-                    <path
-                      d="M19 5v14H5V5h14m0-2H5c-1.1 0-2 .9-2 2v14c0 1.1.9 2 2 2h14c1.1 0 2-.9 2-2V5c0-1.1-.9-2-2-2z"
-                    />
-                  </svg>
-                  <input
-                    checked={false}
-                    className="MuiPrivateSwitchBase-input-167"
-                    data-indeterminate={false}
-                    onChange={[Function]}
-                    type="checkbox"
-                  />
-                </span>
-                <span
-                  className="MuiTouchRipple-root-196"
-                />
-              </span>
-            </td>
-            <td
-              aria-sort={null}
-              className="MuiTableCell-root-146 MuiTableCell-body-148 MuiTableCell-paddingNone-153"
-              onClick={[Function]}
-            >
-              Clementina DuBuque
-            </td>
-            <td
-              aria-sort={null}
-              className="MuiTableCell-root-146 MuiTableCell-body-148 MuiTableCell-paddingNone-153"
-              onClick={[Function]}
-            >
-              Moriah.Stanton
-            </td>
-            <td
-              aria-sort={null}
-              className="MuiTableCell-root-146 MuiTableCell-body-148 MuiTableCell-alignRight-156"
-              onClick={[Function]}
-            >
-              024-648-3804
-            </td>
-            <td
-              aria-sort={null}
-              className="MuiTableCell-root-146 MuiTableCell-body-148 MuiTableCell-paddingNone-153"
-              onClick={[Function]}
-            >
-              <a
-                href="http://ambrose.net"
-              >
-                ambrose.net
-              </a>
-            </td>
-            <td
-              aria-sort={null}
-              className="MuiTableCell-root-146 MuiTableCell-body-148 MuiTableCell-paddingNone-153"
-              onClick={[Function]}
-            >
-              Hoeger LLC
-            </td>
-          </tr>
-        </tbody>
-        <tfoot
-          className="MuiTableFooter-root-174"
-        >
-          <tr
-            className="MuiTableRow-root-141 MuiTableRow-footer-145"
-          >
-            <td
-              aria-sort={null}
-              className="MuiTableCell-root-146 MuiTableCell-footer-149 MuiTablePagination-root-175"
-              colSpan={1000}
-            >
-              <div
-                className="MuiToolbar-root-36 MuiToolbar-regular-38 MuiToolbar-gutters-37 MuiTablePagination-toolbar-176"
-              >
-                <div
-                  className="MuiTablePagination-spacer-177"
-                />
-                <span
-                  className="MuiTypography-root-40 MuiTypography-caption-50 MuiTypography-colorInherit-69 MuiTablePagination-caption-178"
-                >
-                  Rows per page:
-                </span>
-                <div
-                  className="MuiInputBase-root-96 MuiTablePagination-input-182"
-                  onClick={[Function]}
-                >
-                  <div
-                    className="MuiSelect-root-185 MuiTablePagination-selectRoot-179"
-                  >
-                    <div
-                      aria-haspopup="true"
-                      aria-pressed="false"
-                      className="MuiSelect-select-186 MuiTablePagination-select-180 MuiSelect-selectMenu-189 MuiInputBase-input-106"
-                      onBlur={[Function]}
-                      onClick={[Function]}
-                      onFocus={[Function]}
-                      onKeyDown={[Function]}
-                      role="button"
-                      tabIndex={0}
-                    >
-                      10
-                    </div>
-                    <input
-                      type="hidden"
-                      value={10}
-                    />
-                    <svg
-                      aria-hidden="true"
-                      className="MuiSvgIcon-root-130 MuiSelect-icon-191 MuiTablePagination-selectIcon-181"
-                      focusable="false"
-                      role="presentation"
-                      viewBox="0 0 24 24"
-                    >
-                      <path
-                        d="M7 10l5 5 5-5z"
-                      />
-                    </svg>
-                  </div>
-                </div>
-                <span
-                  className="MuiTypography-root-40 MuiTypography-caption-50 MuiTypography-colorInherit-69 MuiTablePagination-caption-178"
-                >
-                  1-10 of 11
-                </span>
-                <div
-                  className="MuiTablePagination-actions-184"
-                >
-                  <button
-                    className="MuiButtonBase-root-127 MuiButtonBase-disabled-128 MuiIconButton-root-121 MuiIconButton-colorInherit-122 MuiIconButton-disabled-125"
-                    disabled={true}
-                    onBlur={[Function]}
-                    onClick={[Function]}
-                    onContextMenu={[Function]}
-                    onFocus={[Function]}
-                    onKeyDown={[Function]}
-                    onKeyUp={[Function]}
-                    onMouseDown={[Function]}
-                    onMouseLeave={[Function]}
-                    onMouseUp={[Function]}
-                    onTouchEnd={[Function]}
-                    onTouchMove={[Function]}
-                    onTouchStart={[Function]}
-                    tabIndex="-1"
-                    type="button"
-                  >
-                    <span
-                      className="MuiIconButton-label-126"
-                    >
-                      <svg
-                        aria-hidden="true"
-                        className="MuiSvgIcon-root-130"
-                        focusable="false"
-                        role="presentation"
-                        viewBox="0 0 24 24"
-                      >
-                        <path
-                          d="M15.41 16.09l-4.58-4.59 4.58-4.59L14 5.5l-6 6 6 6z"
-                        />
-                      </svg>
-                    </span>
-                  </button>
-                  <button
-                    className="MuiButtonBase-root-127 MuiIconButton-root-121 MuiIconButton-colorInherit-122"
-                    disabled={false}
-                    onBlur={[Function]}
-                    onClick={[Function]}
-                    onContextMenu={[Function]}
-                    onFocus={[Function]}
-                    onKeyDown={[Function]}
-                    onKeyUp={[Function]}
-                    onMouseDown={[Function]}
-                    onMouseLeave={[Function]}
-                    onMouseUp={[Function]}
-                    onTouchEnd={[Function]}
-                    onTouchMove={[Function]}
-                    onTouchStart={[Function]}
-                    tabIndex="0"
-                    type="button"
-                  >
-                    <span
-                      className="MuiIconButton-label-126"
-                    >
-                      <svg
-                        aria-hidden="true"
-                        className="MuiSvgIcon-root-130"
-                        focusable="false"
-                        role="presentation"
-                        viewBox="0 0 24 24"
-                      >
-                        <path
-                          d="M8.59 16.34l4.58-4.59-4.58-4.59L10 5.75l6 6-6 6z"
-                        />
-                      </svg>
-                    </span>
-                    <span
-                      className="MuiTouchRipple-root-196"
-                    />
-                  </button>
-                </div>
-              </div>
-            </td>
-          </tr>
-        </tfoot>
-      </table>
-    </div>
-  </div>
+  <WithStyles(ListingBranch)
+    data={
+      Array [
+        Object {
+          "address": Object {
+            "city": "Wisokyburgh",
+            "geo": Object {
+              "lat": "-43.9509",
+              "lng": "-34.4618",
+            },
+            "street": "Victor Plains",
+            "suite": "Suite 879",
+            "zipcode": "90566-7771",
+          },
+          "company": Object {
+            "bs": "synergize scalable supply-chains",
+            "catchPhrase": "Proactive didactic contingency",
+            "name": "Deckow-Crist",
+          },
+          "email": "Shanna@melissa.tv",
+          "id": 2,
+          "name": "Ervin Howell",
+          "phone": "010-692-6593 x09125",
+          "username": "Antonette",
+          "website": "anastasia.net",
+        },
+        Object {
+          "address": Object {
+            "city": "Gwenborough",
+            "geo": Object {
+              "lat": "-37.3159",
+              "lng": "81.1496",
+            },
+            "street": "Kulas Light",
+            "suite": "Apt. 556",
+            "zipcode": "92998-3874",
+          },
+          "company": Object {
+            "bs": "harness real-time e-markets",
+            "catchPhrase": "Multi-layered client-server neural-net",
+            "name": "Romaguera-Crona",
+          },
+          "email": "Sincere@april.biz",
+          "id": 1,
+          "name": "Leanne Graham",
+          "phone": "1-770-736-8031 x56442",
+          "username": "Bret",
+          "website": "hildegard.org",
+        },
+        Object {
+          "address": Object {
+            "city": "Lebsackbury",
+            "geo": Object {
+              "lat": "-38.2386",
+              "lng": "57.2232",
+            },
+            "street": "Kattie Turnpike",
+            "suite": "Suite 198",
+            "zipcode": "31428-2261",
+          },
+          "company": Object {
+            "bs": "target end-to-end models",
+            "catchPhrase": "Centralized empowering task-force",
+            "name": "Hoeger LLC",
+          },
+          "email": "Dan.Schulist@karina.biz",
+          "id": 11,
+          "name": "Mr. Dan Schulist",
+          "phone": "024-648-3804",
+          "username": "Dan.Schulist",
+          "website": "ambrose.net",
+        },
+        Object {
+          "address": Object {
+            "city": "Bartholomebury",
+            "geo": Object {
+              "lat": "24.6463",
+              "lng": "-168.8889",
+            },
+            "street": "Dayna Park",
+            "suite": "Suite 449",
+            "zipcode": "76495-3109",
+          },
+          "company": Object {
+            "bs": "aggregate real-time technologies",
+            "catchPhrase": "Switchable contextually-based project",
+            "name": "Yost and Sons",
+          },
+          "email": "Chaim_McDermott@dana.io",
+          "id": 9,
+          "name": "Glenna Reichert",
+          "phone": "(775)976-6794 x41206",
+          "username": "Delphine",
+          "website": "conrad.com",
+        },
+        Object {
+          "address": Object {
+            "city": "Howemouth",
+            "geo": Object {
+              "lat": "24.8918",
+              "lng": "21.8984",
+            },
+            "street": "Rex Trail",
+            "suite": "Suite 280",
+            "zipcode": "58804-1099",
+          },
+          "company": Object {
+            "bs": "generate enterprise e-tailers",
+            "catchPhrase": "Configurable multimedia task-force",
+            "name": "Johns Group",
+          },
+          "email": "Telly.Hoeger@billy.biz",
+          "id": 7,
+          "name": "Kurtis Weissnat",
+          "phone": "210.067.6132",
+          "username": "Elwyn.Skiles",
+          "website": "elvis.io",
+        },
+        Object {
+          "address": Object {
+            "city": "Roscoeview",
+            "geo": Object {
+              "lat": "-31.8129",
+              "lng": "62.5342",
+            },
+            "street": "Skiles Walks",
+            "suite": "Suite 351",
+            "zipcode": "33263",
+          },
+          "company": Object {
+            "bs": "revolutionize end-to-end systems",
+            "catchPhrase": "User-centric fault-tolerant solution",
+            "name": "Keebler LLC",
+          },
+          "email": "Lucio_Hettinger@annie.ca",
+          "id": 5,
+          "name": "Chelsey Dietrich",
+          "phone": "(254)954-1289",
+          "username": "Kamren",
+          "website": "demarco.info",
+        },
+        Object {
+          "address": Object {
+            "city": "South Elvis",
+            "geo": Object {
+              "lat": "29.4572",
+              "lng": "-164.2990",
+            },
+            "street": "Hoeger Mall",
+            "suite": "Apt. 692",
+            "zipcode": "53919-4257",
+          },
+          "company": Object {
+            "bs": "transition cutting-edge web services",
+            "catchPhrase": "Multi-tiered zero tolerance productivity",
+            "name": "Robel-Corkery",
+          },
+          "email": "Julianne.OConner@kory.org",
+          "id": 4,
+          "name": "Patricia Lebsack",
+          "phone": "493-170-9623 x156",
+          "username": "Karianne",
+          "website": "kale.biz",
+        },
+        Object {
+          "address": Object {
+            "city": "South Christy",
+            "geo": Object {
+              "lat": "-71.4197",
+              "lng": "71.7478",
+            },
+            "street": "Norberto Crossing",
+            "suite": "Apt. 950",
+            "zipcode": "23505-1337",
+          },
+          "company": Object {
+            "bs": "e-enable innovative applications",
+            "catchPhrase": "Synchronised bottom-line interface",
+            "name": "Considine-Lockman",
+          },
+          "email": "Karley_Dach@jasper.info",
+          "id": 6,
+          "name": "Mrs. Dennis Schulist",
+          "phone": "1-477-935-8478 x6430",
+          "username": "Leopoldo_Corkery",
+          "website": "ola.org",
+        },
+        Object {
+          "address": Object {
+            "city": "Aliyaview",
+            "geo": Object {
+              "lat": "-14.3990",
+              "lng": "-120.7677",
+            },
+            "street": "Ellsworth Summit",
+            "suite": "Suite 729",
+            "zipcode": "45169",
+          },
+          "company": Object {
+            "bs": "e-enable extensible e-tailers",
+            "catchPhrase": "Implemented secondary concept",
+            "name": "Abernathy Group",
+          },
+          "email": "Sherwood@rosamond.me",
+          "id": 8,
+          "name": "Nicholas Runolfsdottir V",
+          "phone": "586.493.6943 x140",
+          "username": "Maxime_Nienow",
+          "website": "jacynthe.com",
+        },
+        Object {
+          "address": Object {
+            "city": "Lebsackbury",
+            "geo": Object {
+              "lat": "-38.2386",
+              "lng": "57.2232",
+            },
+            "street": "Kattie Turnpike",
+            "suite": "Suite 198",
+            "zipcode": "31428-2261",
+          },
+          "company": Object {
+            "bs": "target end-to-end models",
+            "catchPhrase": "Centralized empowering task-force",
+            "name": "Hoeger LLC",
+          },
+          "email": "Rey.Padberg@karina.biz",
+          "id": 10,
+          "name": "Clementina DuBuque",
+          "phone": "024-648-3804",
+          "username": "Moriah.Stanton",
+          "website": "ambrose.net",
+        },
+        Object {
+          "address": Object {
+            "city": "McKenziehaven",
+            "geo": Object {
+              "lat": "-68.6102",
+              "lng": "-47.0653",
+            },
+            "street": "Douglas Extension",
+            "suite": "Suite 847",
+            "zipcode": "59590-4157",
+          },
+          "company": Object {
+            "bs": "e-enable strategic applications",
+            "catchPhrase": "Face to face bifurcated interface",
+            "name": "Romaguera-Jacobson",
+          },
+          "email": "Nathan@yesenia.net",
+          "id": 3,
+          "name": "Clementine Bauch",
+          "phone": "1-463-123-4447",
+          "username": "Samantha",
+          "website": "ramiro.info",
+        },
+      ]
+    }
+    handleChangePage={[Function]}
+    handleChangeRowsPerPage={[Function]}
+    handleCheckClick={[Function]}
+    handleKeyDown={[Function]}
+    handleRequestSort={[Function]}
+    handleSelectAllClick={[Function]}
+    hasLoader={false}
+    headers={
+      Array [
+        Object {
+          "id": "name",
+          "isPaddingDisabled": true,
+          "isSearchable": true,
+          "label": "Name",
+        },
+        Object {
+          "id": "username",
+          "isPaddingDisabled": true,
+          "isSearchable": true,
+          "label": "Username",
+        },
+        Object {
+          "id": "phone",
+          "isNumeric": true,
+          "isPaddingDisabled": false,
+          "isSearchable": true,
+          "label": "Phone",
+        },
+        Object {
+          "id": "website",
+          "isPaddingDisabled": true,
+          "label": "Website",
+          "transformContent": [Function],
+        },
+        Object {
+          "id": "company",
+          "isPaddingDisabled": true,
+          "isSearchable": true,
+          "label": "Company",
+          "transformContent": [Function],
+        },
+      ]
+    }
+    id={null}
+    isSelected={[Function]}
+    onClick={[Function]}
+    onFilter={[Function]}
+    onUpdateSelection={[Function]}
+    order="asc"
+    orderBy="username"
+    origData={null}
+    page={0}
+    rowsPerPage={10}
+    searchable={
+      Array [
+        "name",
+        "username",
+        "phone",
+        "company",
+      ]
+    }
+    selected={Array []}
+    title="Christmas Time"
+    toolbarContent={<React.Fragment />}
+  />
 </div>
 `;
 
 exports[`Listing renders correctly with Loader 1`] = `
 <div>
-  <div
-    className="MuiPaper-root-4 MuiPaper-elevation4-10 MuiPaper-rounded-5 ListingBranch-root-1"
-  >
-    <div
-      className="MuiToolbar-root-36 MuiToolbar-regular-38 MuiToolbar-gutters-37 ListingToolbar-root-31"
-    >
-      <div
-        className="ListingToolbar-title-35"
-      >
-        <h6
-          className="MuiTypography-root-40 MuiTypography-h6-57"
-        >
-          Christmas Time
-        </h6>
-      </div>
-      <div
-        className="ListingToolbar-spacer-33"
-      />
-      <div
-        className="ListingToolbar-actions-34"
-      >
-        <div
-          className="ListingSearchBranch-root-76"
-        >
-          <div
-            className="MuiFormControl-root-79 ListingSearchBranch-field-77"
-          >
-            <div
-              className="MuiInputBase-root-96 MuiInput-root-83 MuiInput-underline-87 MuiInputBase-formControl-97 MuiInput-formControl-84"
-              onClick={[Function]}
-            >
-              <input
-                aria-invalid={false}
-                className="MuiInputBase-input-106 MuiInput-input-91 MuiInputBase-inputType-109 MuiInput-inputType-94 MuiInputBase-inputTypeSearch-110 MuiInput-inputTypeSearch-95"
-                disabled={false}
-                onBlur={[Function]}
-                onChange={[Function]}
-                onFocus={[Function]}
-                placeholder="Filter"
-                required={false}
-                type="search"
-              />
-            </div>
-          </div>
-          Array [
-            <button
-              aria-describedby={null}
-              className="MuiButtonBase-root-127 MuiIconButton-root-121"
-              disabled={false}
-              onBlur={[Function]}
-              onClick={[Function]}
-              onContextMenu={[Function]}
-              onFocus={[Function]}
-              onKeyDown={[Function]}
-              onKeyUp={[Function]}
-              onMouseDown={[Function]}
-              onMouseLeave={[Function]}
-              onMouseOver={[Function]}
-              onMouseUp={[Function]}
-              onTouchEnd={[Function]}
-              onTouchMove={[Function]}
-              onTouchStart={[Function]}
-              tabIndex="0"
-              title="Search"
-              type="button"
-            >
-              <span
-                className="MuiIconButton-label-126"
-              >
-                <svg
-                  aria-hidden="true"
-                  className="MuiSvgIcon-root-130"
-                  focusable="false"
-                  role="presentation"
-                  viewBox="0 0 24 24"
-                >
-                  <path
-                    d="M15.5 14h-.79l-.28-.27C15.41 12.59 16 11.11 16 9.5 16 5.91 13.09 3 9.5 3S3 5.91 3 9.5 5.91 16 9.5 16c1.61 0 3.09-.59 4.23-1.57l.27.28v.79l5 4.99L20.49 19l-4.99-5zm-6 0C7.01 14 5 11.99 5 9.5S7.01 5 9.5 5 14 7.01 14 9.5 11.99 14 9.5 14z"
-                  />
-                  <path
-                    d="M0 0h24v24H0z"
-                    fill="none"
-                  />
-                </svg>
-              </span>
-              <span
-                className="MuiTouchRipple-root-196"
-              />
-            </button>,
-            "",
-          ]
-        </div>
-      </div>
-    </div>
-    <div
-      className="ListingBranch-tableWrapper-3"
-    >
-      <table
-        className="MuiTable-root-139 ListingBranch-table-2"
-      >
-        <thead
-          className="MuiTableHead-root-140"
-        >
-          <tr
-            className="MuiTableRow-root-141 MuiTableRow-head-144"
-          >
-            <th
-              aria-sort={null}
-              className="MuiTableCell-root-146 MuiTableCell-head-147 MuiTableCell-paddingCheckbox-152"
-              scope="col"
-            >
-              <span
-                className="MuiButtonBase-root-127 MuiIconButton-root-121 MuiPrivateSwitchBase-root-164 MuiCheckbox-root-158 MuiCheckbox-colorPrimary-162"
-                onBlur={[Function]}
-                onContextMenu={[Function]}
-                onFocus={[Function]}
-                onKeyDown={[Function]}
-                onKeyUp={[Function]}
-                onMouseDown={[Function]}
-                onMouseLeave={[Function]}
-                onMouseUp={[Function]}
-                onTouchEnd={[Function]}
-                onTouchMove={[Function]}
-                onTouchStart={[Function]}
-                tabIndex={null}
-              >
-                <span
-                  className="MuiIconButton-label-126"
-                >
-                  <svg
-                    aria-hidden="true"
-                    className="MuiSvgIcon-root-130"
-                    focusable="false"
-                    role="presentation"
-                    viewBox="0 0 24 24"
-                  >
-                    <path
-                      d="M19 5v14H5V5h14m0-2H5c-1.1 0-2 .9-2 2v14c0 1.1.9 2 2 2h14c1.1 0 2-.9 2-2V5c0-1.1-.9-2-2-2z"
-                    />
-                  </svg>
-                  <input
-                    checked={false}
-                    className="MuiPrivateSwitchBase-input-167"
-                    data-indeterminate={false}
-                    onChange={[Function]}
-                    type="checkbox"
-                  />
-                </span>
-                <span
-                  className="MuiTouchRipple-root-196"
-                />
-              </span>
-            </th>
-            <th
-              aria-sort={null}
-              className="MuiTableCell-root-146 MuiTableCell-head-147 MuiTableCell-paddingNone-153"
-              scope="col"
-            >
-              Array [
-                <span
-                  aria-describedby={null}
-                  className="MuiButtonBase-root-127 MuiTableSortLabel-root-168"
-                  onBlur={[Function]}
-                  onClick={[Function]}
-                  onContextMenu={[Function]}
-                  onFocus={[Function]}
-                  onKeyDown={[Function]}
-                  onKeyUp={[Function]}
-                  onMouseDown={[Function]}
-                  onMouseLeave={[Function]}
-                  onMouseOver={[Function]}
-                  onMouseUp={[Function]}
-                  onTouchEnd={[Function]}
-                  onTouchMove={[Function]}
-                  onTouchStart={[Function]}
-                  role="button"
-                  tabIndex="0"
-                  title="Sort"
-                >
-                  Name
-                  <svg
-                    aria-hidden="true"
-                    className="MuiSvgIcon-root-130 MuiTableSortLabel-icon-170 MuiTableSortLabel-iconDirectionAsc-172"
-                    focusable="false"
-                    role="presentation"
-                    viewBox="0 0 24 24"
-                  >
-                    <path
-                      d="M20 12l-1.41-1.41L13 16.17V4h-2v12.17l-5.58-5.59L4 12l8 8 8-8z"
-                    />
-                  </svg>
-                </span>,
-                "",
-              ]
-            </th>
-            <th
-              aria-sort={null}
-              className="MuiTableCell-root-146 MuiTableCell-head-147 MuiTableCell-paddingNone-153"
-              scope="col"
-            >
-              Array [
-                <span
-                  aria-describedby={null}
-                  className="MuiButtonBase-root-127 MuiTableSortLabel-root-168 MuiTableSortLabel-active-169"
-                  onBlur={[Function]}
-                  onClick={[Function]}
-                  onContextMenu={[Function]}
-                  onFocus={[Function]}
-                  onKeyDown={[Function]}
-                  onKeyUp={[Function]}
-                  onMouseDown={[Function]}
-                  onMouseLeave={[Function]}
-                  onMouseOver={[Function]}
-                  onMouseUp={[Function]}
-                  onTouchEnd={[Function]}
-                  onTouchMove={[Function]}
-                  onTouchStart={[Function]}
-                  role="button"
-                  tabIndex="0"
-                  title="Sort"
-                >
-                  Username
-                  <svg
-                    aria-hidden="true"
-                    className="MuiSvgIcon-root-130 MuiTableSortLabel-icon-170 MuiTableSortLabel-iconDirectionAsc-172"
-                    focusable="false"
-                    role="presentation"
-                    viewBox="0 0 24 24"
-                  >
-                    <path
-                      d="M20 12l-1.41-1.41L13 16.17V4h-2v12.17l-5.58-5.59L4 12l8 8 8-8z"
-                    />
-                  </svg>
-                </span>,
-                "",
-              ]
-            </th>
-            <th
-              aria-sort={null}
-              className="MuiTableCell-root-146 MuiTableCell-head-147 MuiTableCell-alignRight-156"
-              scope="col"
-            >
-              Array [
-                <span
-                  aria-describedby={null}
-                  className="MuiButtonBase-root-127 MuiTableSortLabel-root-168"
-                  onBlur={[Function]}
-                  onClick={[Function]}
-                  onContextMenu={[Function]}
-                  onFocus={[Function]}
-                  onKeyDown={[Function]}
-                  onKeyUp={[Function]}
-                  onMouseDown={[Function]}
-                  onMouseLeave={[Function]}
-                  onMouseOver={[Function]}
-                  onMouseUp={[Function]}
-                  onTouchEnd={[Function]}
-                  onTouchMove={[Function]}
-                  onTouchStart={[Function]}
-                  role="button"
-                  tabIndex="0"
-                  title="Sort"
-                >
-                  Phone
-                  <svg
-                    aria-hidden="true"
-                    className="MuiSvgIcon-root-130 MuiTableSortLabel-icon-170 MuiTableSortLabel-iconDirectionAsc-172"
-                    focusable="false"
-                    role="presentation"
-                    viewBox="0 0 24 24"
-                  >
-                    <path
-                      d="M20 12l-1.41-1.41L13 16.17V4h-2v12.17l-5.58-5.59L4 12l8 8 8-8z"
-                    />
-                  </svg>
-                </span>,
-                "",
-              ]
-            </th>
-            <th
-              aria-sort={null}
-              className="MuiTableCell-root-146 MuiTableCell-head-147 MuiTableCell-paddingNone-153"
-              scope="col"
-            >
-              Array [
-                <span
-                  aria-describedby={null}
-                  className="MuiButtonBase-root-127 MuiTableSortLabel-root-168"
-                  onBlur={[Function]}
-                  onClick={[Function]}
-                  onContextMenu={[Function]}
-                  onFocus={[Function]}
-                  onKeyDown={[Function]}
-                  onKeyUp={[Function]}
-                  onMouseDown={[Function]}
-                  onMouseLeave={[Function]}
-                  onMouseOver={[Function]}
-                  onMouseUp={[Function]}
-                  onTouchEnd={[Function]}
-                  onTouchMove={[Function]}
-                  onTouchStart={[Function]}
-                  role="button"
-                  tabIndex="0"
-                  title="Sort"
-                >
-                  Website
-                  <svg
-                    aria-hidden="true"
-                    className="MuiSvgIcon-root-130 MuiTableSortLabel-icon-170 MuiTableSortLabel-iconDirectionAsc-172"
-                    focusable="false"
-                    role="presentation"
-                    viewBox="0 0 24 24"
-                  >
-                    <path
-                      d="M20 12l-1.41-1.41L13 16.17V4h-2v12.17l-5.58-5.59L4 12l8 8 8-8z"
-                    />
-                  </svg>
-                </span>,
-                "",
-              ]
-            </th>
-            <th
-              aria-sort={null}
-              className="MuiTableCell-root-146 MuiTableCell-head-147 MuiTableCell-paddingNone-153"
-              scope="col"
-            >
-              Array [
-                <span
-                  aria-describedby={null}
-                  className="MuiButtonBase-root-127 MuiTableSortLabel-root-168"
-                  onBlur={[Function]}
-                  onClick={[Function]}
-                  onContextMenu={[Function]}
-                  onFocus={[Function]}
-                  onKeyDown={[Function]}
-                  onKeyUp={[Function]}
-                  onMouseDown={[Function]}
-                  onMouseLeave={[Function]}
-                  onMouseOver={[Function]}
-                  onMouseUp={[Function]}
-                  onTouchEnd={[Function]}
-                  onTouchMove={[Function]}
-                  onTouchStart={[Function]}
-                  role="button"
-                  tabIndex="0"
-                  title="Sort"
-                >
-                  Company
-                  <svg
-                    aria-hidden="true"
-                    className="MuiSvgIcon-root-130 MuiTableSortLabel-icon-170 MuiTableSortLabel-iconDirectionAsc-172"
-                    focusable="false"
-                    role="presentation"
-                    viewBox="0 0 24 24"
-                  >
-                    <path
-                      d="M20 12l-1.41-1.41L13 16.17V4h-2v12.17l-5.58-5.59L4 12l8 8 8-8z"
-                    />
-                  </svg>
-                </span>,
-                "",
-              ]
-            </th>
-          </tr>
-        </thead>
-        <tbody
-          className="MuiTableBody-root-173"
-        >
-          <tr
-            className="MuiTableRow-root-141 ListingLoader-row-203"
-          >
-            <td
-              aria-sort={null}
-              className="MuiTableCell-root-146 MuiTableCell-body-148 MuiTableCell-paddingNone-153 ListingLoader-cell-204"
-              colSpan={6}
-            >
-              <div
-                className="MuiLinearProgress-root-206 MuiLinearProgress-colorPrimary-207 MuiLinearProgress-indeterminate-210 ListingLoader-progress-205"
-                mode="query"
-                role="progressbar"
-              >
-                <div
-                  className="MuiLinearProgress-bar-216 MuiLinearProgress-barColorPrimary-217 MuiLinearProgress-bar1Indeterminate-219"
-                  style={Object {}}
-                />
-                <div
-                  className="MuiLinearProgress-bar-216 MuiLinearProgress-barColorPrimary-217 MuiLinearProgress-bar2Indeterminate-222"
-                  style={Object {}}
-                />
-              </div>
-            </td>
-          </tr>
-          <tr
-            aria-checked={false}
-            className="MuiTableRow-root-141 MuiTableRow-hover-143"
-            onKeyDown={[Function]}
-            role="checkbox"
-            tabIndex={-1}
-          >
-            <td
-              aria-sort={null}
-              className="MuiTableCell-root-146 MuiTableCell-body-148 MuiTableCell-paddingCheckbox-152"
-              onClick={[Function]}
-            >
-              <span
-                className="MuiButtonBase-root-127 MuiIconButton-root-121 MuiPrivateSwitchBase-root-164 MuiCheckbox-root-158 MuiCheckbox-colorPrimary-162"
-                onBlur={[Function]}
-                onContextMenu={[Function]}
-                onFocus={[Function]}
-                onKeyDown={[Function]}
-                onKeyUp={[Function]}
-                onMouseDown={[Function]}
-                onMouseLeave={[Function]}
-                onMouseUp={[Function]}
-                onTouchEnd={[Function]}
-                onTouchMove={[Function]}
-                onTouchStart={[Function]}
-                tabIndex={null}
-              >
-                <span
-                  className="MuiIconButton-label-126"
-                >
-                  <svg
-                    aria-hidden="true"
-                    className="MuiSvgIcon-root-130"
-                    focusable="false"
-                    role="presentation"
-                    viewBox="0 0 24 24"
-                  >
-                    <path
-                      d="M19 5v14H5V5h14m0-2H5c-1.1 0-2 .9-2 2v14c0 1.1.9 2 2 2h14c1.1 0 2-.9 2-2V5c0-1.1-.9-2-2-2z"
-                    />
-                  </svg>
-                  <input
-                    checked={false}
-                    className="MuiPrivateSwitchBase-input-167"
-                    data-indeterminate={false}
-                    onChange={[Function]}
-                    type="checkbox"
-                  />
-                </span>
-                <span
-                  className="MuiTouchRipple-root-196"
-                />
-              </span>
-            </td>
-            <td
-              aria-sort={null}
-              className="MuiTableCell-root-146 MuiTableCell-body-148 MuiTableCell-paddingNone-153"
-              onClick={[Function]}
-            >
-              Ervin Howell
-            </td>
-            <td
-              aria-sort={null}
-              className="MuiTableCell-root-146 MuiTableCell-body-148 MuiTableCell-paddingNone-153"
-              onClick={[Function]}
-            >
-              Antonette
-            </td>
-            <td
-              aria-sort={null}
-              className="MuiTableCell-root-146 MuiTableCell-body-148 MuiTableCell-alignRight-156"
-              onClick={[Function]}
-            >
-              010-692-6593 x09125
-            </td>
-            <td
-              aria-sort={null}
-              className="MuiTableCell-root-146 MuiTableCell-body-148 MuiTableCell-paddingNone-153"
-              onClick={[Function]}
-            >
-              <a
-                href="http://anastasia.net"
-              >
-                anastasia.net
-              </a>
-            </td>
-            <td
-              aria-sort={null}
-              className="MuiTableCell-root-146 MuiTableCell-body-148 MuiTableCell-paddingNone-153"
-              onClick={[Function]}
-            >
-              Deckow-Crist
-            </td>
-          </tr>
-          <tr
-            aria-checked={false}
-            className="MuiTableRow-root-141 MuiTableRow-hover-143"
-            onKeyDown={[Function]}
-            role="checkbox"
-            tabIndex={-1}
-          >
-            <td
-              aria-sort={null}
-              className="MuiTableCell-root-146 MuiTableCell-body-148 MuiTableCell-paddingCheckbox-152"
-              onClick={[Function]}
-            >
-              <span
-                className="MuiButtonBase-root-127 MuiIconButton-root-121 MuiPrivateSwitchBase-root-164 MuiCheckbox-root-158 MuiCheckbox-colorPrimary-162"
-                onBlur={[Function]}
-                onContextMenu={[Function]}
-                onFocus={[Function]}
-                onKeyDown={[Function]}
-                onKeyUp={[Function]}
-                onMouseDown={[Function]}
-                onMouseLeave={[Function]}
-                onMouseUp={[Function]}
-                onTouchEnd={[Function]}
-                onTouchMove={[Function]}
-                onTouchStart={[Function]}
-                tabIndex={null}
-              >
-                <span
-                  className="MuiIconButton-label-126"
-                >
-                  <svg
-                    aria-hidden="true"
-                    className="MuiSvgIcon-root-130"
-                    focusable="false"
-                    role="presentation"
-                    viewBox="0 0 24 24"
-                  >
-                    <path
-                      d="M19 5v14H5V5h14m0-2H5c-1.1 0-2 .9-2 2v14c0 1.1.9 2 2 2h14c1.1 0 2-.9 2-2V5c0-1.1-.9-2-2-2z"
-                    />
-                  </svg>
-                  <input
-                    checked={false}
-                    className="MuiPrivateSwitchBase-input-167"
-                    data-indeterminate={false}
-                    onChange={[Function]}
-                    type="checkbox"
-                  />
-                </span>
-                <span
-                  className="MuiTouchRipple-root-196"
-                />
-              </span>
-            </td>
-            <td
-              aria-sort={null}
-              className="MuiTableCell-root-146 MuiTableCell-body-148 MuiTableCell-paddingNone-153"
-              onClick={[Function]}
-            >
-              Leanne Graham
-            </td>
-            <td
-              aria-sort={null}
-              className="MuiTableCell-root-146 MuiTableCell-body-148 MuiTableCell-paddingNone-153"
-              onClick={[Function]}
-            >
-              Bret
-            </td>
-            <td
-              aria-sort={null}
-              className="MuiTableCell-root-146 MuiTableCell-body-148 MuiTableCell-alignRight-156"
-              onClick={[Function]}
-            >
-              1-770-736-8031 x56442
-            </td>
-            <td
-              aria-sort={null}
-              className="MuiTableCell-root-146 MuiTableCell-body-148 MuiTableCell-paddingNone-153"
-              onClick={[Function]}
-            >
-              <a
-                href="http://hildegard.org"
-              >
-                hildegard.org
-              </a>
-            </td>
-            <td
-              aria-sort={null}
-              className="MuiTableCell-root-146 MuiTableCell-body-148 MuiTableCell-paddingNone-153"
-              onClick={[Function]}
-            >
-              Romaguera-Crona
-            </td>
-          </tr>
-          <tr
-            aria-checked={false}
-            className="MuiTableRow-root-141 MuiTableRow-hover-143"
-            onKeyDown={[Function]}
-            role="checkbox"
-            tabIndex={-1}
-          >
-            <td
-              aria-sort={null}
-              className="MuiTableCell-root-146 MuiTableCell-body-148 MuiTableCell-paddingCheckbox-152"
-              onClick={[Function]}
-            >
-              <span
-                className="MuiButtonBase-root-127 MuiIconButton-root-121 MuiPrivateSwitchBase-root-164 MuiCheckbox-root-158 MuiCheckbox-colorPrimary-162"
-                onBlur={[Function]}
-                onContextMenu={[Function]}
-                onFocus={[Function]}
-                onKeyDown={[Function]}
-                onKeyUp={[Function]}
-                onMouseDown={[Function]}
-                onMouseLeave={[Function]}
-                onMouseUp={[Function]}
-                onTouchEnd={[Function]}
-                onTouchMove={[Function]}
-                onTouchStart={[Function]}
-                tabIndex={null}
-              >
-                <span
-                  className="MuiIconButton-label-126"
-                >
-                  <svg
-                    aria-hidden="true"
-                    className="MuiSvgIcon-root-130"
-                    focusable="false"
-                    role="presentation"
-                    viewBox="0 0 24 24"
-                  >
-                    <path
-                      d="M19 5v14H5V5h14m0-2H5c-1.1 0-2 .9-2 2v14c0 1.1.9 2 2 2h14c1.1 0 2-.9 2-2V5c0-1.1-.9-2-2-2z"
-                    />
-                  </svg>
-                  <input
-                    checked={false}
-                    className="MuiPrivateSwitchBase-input-167"
-                    data-indeterminate={false}
-                    onChange={[Function]}
-                    type="checkbox"
-                  />
-                </span>
-                <span
-                  className="MuiTouchRipple-root-196"
-                />
-              </span>
-            </td>
-            <td
-              aria-sort={null}
-              className="MuiTableCell-root-146 MuiTableCell-body-148 MuiTableCell-paddingNone-153"
-              onClick={[Function]}
-            >
-              Mr. Dan Schulist
-            </td>
-            <td
-              aria-sort={null}
-              className="MuiTableCell-root-146 MuiTableCell-body-148 MuiTableCell-paddingNone-153"
-              onClick={[Function]}
-            >
-              Dan.Schulist
-            </td>
-            <td
-              aria-sort={null}
-              className="MuiTableCell-root-146 MuiTableCell-body-148 MuiTableCell-alignRight-156"
-              onClick={[Function]}
-            >
-              024-648-3804
-            </td>
-            <td
-              aria-sort={null}
-              className="MuiTableCell-root-146 MuiTableCell-body-148 MuiTableCell-paddingNone-153"
-              onClick={[Function]}
-            >
-              <a
-                href="http://ambrose.net"
-              >
-                ambrose.net
-              </a>
-            </td>
-            <td
-              aria-sort={null}
-              className="MuiTableCell-root-146 MuiTableCell-body-148 MuiTableCell-paddingNone-153"
-              onClick={[Function]}
-            >
-              Hoeger LLC
-            </td>
-          </tr>
-          <tr
-            aria-checked={false}
-            className="MuiTableRow-root-141 MuiTableRow-hover-143"
-            onKeyDown={[Function]}
-            role="checkbox"
-            tabIndex={-1}
-          >
-            <td
-              aria-sort={null}
-              className="MuiTableCell-root-146 MuiTableCell-body-148 MuiTableCell-paddingCheckbox-152"
-              onClick={[Function]}
-            >
-              <span
-                className="MuiButtonBase-root-127 MuiIconButton-root-121 MuiPrivateSwitchBase-root-164 MuiCheckbox-root-158 MuiCheckbox-colorPrimary-162"
-                onBlur={[Function]}
-                onContextMenu={[Function]}
-                onFocus={[Function]}
-                onKeyDown={[Function]}
-                onKeyUp={[Function]}
-                onMouseDown={[Function]}
-                onMouseLeave={[Function]}
-                onMouseUp={[Function]}
-                onTouchEnd={[Function]}
-                onTouchMove={[Function]}
-                onTouchStart={[Function]}
-                tabIndex={null}
-              >
-                <span
-                  className="MuiIconButton-label-126"
-                >
-                  <svg
-                    aria-hidden="true"
-                    className="MuiSvgIcon-root-130"
-                    focusable="false"
-                    role="presentation"
-                    viewBox="0 0 24 24"
-                  >
-                    <path
-                      d="M19 5v14H5V5h14m0-2H5c-1.1 0-2 .9-2 2v14c0 1.1.9 2 2 2h14c1.1 0 2-.9 2-2V5c0-1.1-.9-2-2-2z"
-                    />
-                  </svg>
-                  <input
-                    checked={false}
-                    className="MuiPrivateSwitchBase-input-167"
-                    data-indeterminate={false}
-                    onChange={[Function]}
-                    type="checkbox"
-                  />
-                </span>
-                <span
-                  className="MuiTouchRipple-root-196"
-                />
-              </span>
-            </td>
-            <td
-              aria-sort={null}
-              className="MuiTableCell-root-146 MuiTableCell-body-148 MuiTableCell-paddingNone-153"
-              onClick={[Function]}
-            >
-              Glenna Reichert
-            </td>
-            <td
-              aria-sort={null}
-              className="MuiTableCell-root-146 MuiTableCell-body-148 MuiTableCell-paddingNone-153"
-              onClick={[Function]}
-            >
-              Delphine
-            </td>
-            <td
-              aria-sort={null}
-              className="MuiTableCell-root-146 MuiTableCell-body-148 MuiTableCell-alignRight-156"
-              onClick={[Function]}
-            >
-              (775)976-6794 x41206
-            </td>
-            <td
-              aria-sort={null}
-              className="MuiTableCell-root-146 MuiTableCell-body-148 MuiTableCell-paddingNone-153"
-              onClick={[Function]}
-            >
-              <a
-                href="http://conrad.com"
-              >
-                conrad.com
-              </a>
-            </td>
-            <td
-              aria-sort={null}
-              className="MuiTableCell-root-146 MuiTableCell-body-148 MuiTableCell-paddingNone-153"
-              onClick={[Function]}
-            >
-              Yost and Sons
-            </td>
-          </tr>
-          <tr
-            aria-checked={false}
-            className="MuiTableRow-root-141 MuiTableRow-hover-143"
-            onKeyDown={[Function]}
-            role="checkbox"
-            tabIndex={-1}
-          >
-            <td
-              aria-sort={null}
-              className="MuiTableCell-root-146 MuiTableCell-body-148 MuiTableCell-paddingCheckbox-152"
-              onClick={[Function]}
-            >
-              <span
-                className="MuiButtonBase-root-127 MuiIconButton-root-121 MuiPrivateSwitchBase-root-164 MuiCheckbox-root-158 MuiCheckbox-colorPrimary-162"
-                onBlur={[Function]}
-                onContextMenu={[Function]}
-                onFocus={[Function]}
-                onKeyDown={[Function]}
-                onKeyUp={[Function]}
-                onMouseDown={[Function]}
-                onMouseLeave={[Function]}
-                onMouseUp={[Function]}
-                onTouchEnd={[Function]}
-                onTouchMove={[Function]}
-                onTouchStart={[Function]}
-                tabIndex={null}
-              >
-                <span
-                  className="MuiIconButton-label-126"
-                >
-                  <svg
-                    aria-hidden="true"
-                    className="MuiSvgIcon-root-130"
-                    focusable="false"
-                    role="presentation"
-                    viewBox="0 0 24 24"
-                  >
-                    <path
-                      d="M19 5v14H5V5h14m0-2H5c-1.1 0-2 .9-2 2v14c0 1.1.9 2 2 2h14c1.1 0 2-.9 2-2V5c0-1.1-.9-2-2-2z"
-                    />
-                  </svg>
-                  <input
-                    checked={false}
-                    className="MuiPrivateSwitchBase-input-167"
-                    data-indeterminate={false}
-                    onChange={[Function]}
-                    type="checkbox"
-                  />
-                </span>
-                <span
-                  className="MuiTouchRipple-root-196"
-                />
-              </span>
-            </td>
-            <td
-              aria-sort={null}
-              className="MuiTableCell-root-146 MuiTableCell-body-148 MuiTableCell-paddingNone-153"
-              onClick={[Function]}
-            >
-              Kurtis Weissnat
-            </td>
-            <td
-              aria-sort={null}
-              className="MuiTableCell-root-146 MuiTableCell-body-148 MuiTableCell-paddingNone-153"
-              onClick={[Function]}
-            >
-              Elwyn.Skiles
-            </td>
-            <td
-              aria-sort={null}
-              className="MuiTableCell-root-146 MuiTableCell-body-148 MuiTableCell-alignRight-156"
-              onClick={[Function]}
-            >
-              210.067.6132
-            </td>
-            <td
-              aria-sort={null}
-              className="MuiTableCell-root-146 MuiTableCell-body-148 MuiTableCell-paddingNone-153"
-              onClick={[Function]}
-            >
-              <a
-                href="http://elvis.io"
-              >
-                elvis.io
-              </a>
-            </td>
-            <td
-              aria-sort={null}
-              className="MuiTableCell-root-146 MuiTableCell-body-148 MuiTableCell-paddingNone-153"
-              onClick={[Function]}
-            >
-              Johns Group
-            </td>
-          </tr>
-          <tr
-            aria-checked={false}
-            className="MuiTableRow-root-141 MuiTableRow-hover-143"
-            onKeyDown={[Function]}
-            role="checkbox"
-            tabIndex={-1}
-          >
-            <td
-              aria-sort={null}
-              className="MuiTableCell-root-146 MuiTableCell-body-148 MuiTableCell-paddingCheckbox-152"
-              onClick={[Function]}
-            >
-              <span
-                className="MuiButtonBase-root-127 MuiIconButton-root-121 MuiPrivateSwitchBase-root-164 MuiCheckbox-root-158 MuiCheckbox-colorPrimary-162"
-                onBlur={[Function]}
-                onContextMenu={[Function]}
-                onFocus={[Function]}
-                onKeyDown={[Function]}
-                onKeyUp={[Function]}
-                onMouseDown={[Function]}
-                onMouseLeave={[Function]}
-                onMouseUp={[Function]}
-                onTouchEnd={[Function]}
-                onTouchMove={[Function]}
-                onTouchStart={[Function]}
-                tabIndex={null}
-              >
-                <span
-                  className="MuiIconButton-label-126"
-                >
-                  <svg
-                    aria-hidden="true"
-                    className="MuiSvgIcon-root-130"
-                    focusable="false"
-                    role="presentation"
-                    viewBox="0 0 24 24"
-                  >
-                    <path
-                      d="M19 5v14H5V5h14m0-2H5c-1.1 0-2 .9-2 2v14c0 1.1.9 2 2 2h14c1.1 0 2-.9 2-2V5c0-1.1-.9-2-2-2z"
-                    />
-                  </svg>
-                  <input
-                    checked={false}
-                    className="MuiPrivateSwitchBase-input-167"
-                    data-indeterminate={false}
-                    onChange={[Function]}
-                    type="checkbox"
-                  />
-                </span>
-                <span
-                  className="MuiTouchRipple-root-196"
-                />
-              </span>
-            </td>
-            <td
-              aria-sort={null}
-              className="MuiTableCell-root-146 MuiTableCell-body-148 MuiTableCell-paddingNone-153"
-              onClick={[Function]}
-            >
-              Chelsey Dietrich
-            </td>
-            <td
-              aria-sort={null}
-              className="MuiTableCell-root-146 MuiTableCell-body-148 MuiTableCell-paddingNone-153"
-              onClick={[Function]}
-            >
-              Kamren
-            </td>
-            <td
-              aria-sort={null}
-              className="MuiTableCell-root-146 MuiTableCell-body-148 MuiTableCell-alignRight-156"
-              onClick={[Function]}
-            >
-              (254)954-1289
-            </td>
-            <td
-              aria-sort={null}
-              className="MuiTableCell-root-146 MuiTableCell-body-148 MuiTableCell-paddingNone-153"
-              onClick={[Function]}
-            >
-              <a
-                href="http://demarco.info"
-              >
-                demarco.info
-              </a>
-            </td>
-            <td
-              aria-sort={null}
-              className="MuiTableCell-root-146 MuiTableCell-body-148 MuiTableCell-paddingNone-153"
-              onClick={[Function]}
-            >
-              Keebler LLC
-            </td>
-          </tr>
-          <tr
-            aria-checked={false}
-            className="MuiTableRow-root-141 MuiTableRow-hover-143"
-            onKeyDown={[Function]}
-            role="checkbox"
-            tabIndex={-1}
-          >
-            <td
-              aria-sort={null}
-              className="MuiTableCell-root-146 MuiTableCell-body-148 MuiTableCell-paddingCheckbox-152"
-              onClick={[Function]}
-            >
-              <span
-                className="MuiButtonBase-root-127 MuiIconButton-root-121 MuiPrivateSwitchBase-root-164 MuiCheckbox-root-158 MuiCheckbox-colorPrimary-162"
-                onBlur={[Function]}
-                onContextMenu={[Function]}
-                onFocus={[Function]}
-                onKeyDown={[Function]}
-                onKeyUp={[Function]}
-                onMouseDown={[Function]}
-                onMouseLeave={[Function]}
-                onMouseUp={[Function]}
-                onTouchEnd={[Function]}
-                onTouchMove={[Function]}
-                onTouchStart={[Function]}
-                tabIndex={null}
-              >
-                <span
-                  className="MuiIconButton-label-126"
-                >
-                  <svg
-                    aria-hidden="true"
-                    className="MuiSvgIcon-root-130"
-                    focusable="false"
-                    role="presentation"
-                    viewBox="0 0 24 24"
-                  >
-                    <path
-                      d="M19 5v14H5V5h14m0-2H5c-1.1 0-2 .9-2 2v14c0 1.1.9 2 2 2h14c1.1 0 2-.9 2-2V5c0-1.1-.9-2-2-2z"
-                    />
-                  </svg>
-                  <input
-                    checked={false}
-                    className="MuiPrivateSwitchBase-input-167"
-                    data-indeterminate={false}
-                    onChange={[Function]}
-                    type="checkbox"
-                  />
-                </span>
-                <span
-                  className="MuiTouchRipple-root-196"
-                />
-              </span>
-            </td>
-            <td
-              aria-sort={null}
-              className="MuiTableCell-root-146 MuiTableCell-body-148 MuiTableCell-paddingNone-153"
-              onClick={[Function]}
-            >
-              Patricia Lebsack
-            </td>
-            <td
-              aria-sort={null}
-              className="MuiTableCell-root-146 MuiTableCell-body-148 MuiTableCell-paddingNone-153"
-              onClick={[Function]}
-            >
-              Karianne
-            </td>
-            <td
-              aria-sort={null}
-              className="MuiTableCell-root-146 MuiTableCell-body-148 MuiTableCell-alignRight-156"
-              onClick={[Function]}
-            >
-              493-170-9623 x156
-            </td>
-            <td
-              aria-sort={null}
-              className="MuiTableCell-root-146 MuiTableCell-body-148 MuiTableCell-paddingNone-153"
-              onClick={[Function]}
-            >
-              <a
-                href="http://kale.biz"
-              >
-                kale.biz
-              </a>
-            </td>
-            <td
-              aria-sort={null}
-              className="MuiTableCell-root-146 MuiTableCell-body-148 MuiTableCell-paddingNone-153"
-              onClick={[Function]}
-            >
-              Robel-Corkery
-            </td>
-          </tr>
-          <tr
-            aria-checked={false}
-            className="MuiTableRow-root-141 MuiTableRow-hover-143"
-            onKeyDown={[Function]}
-            role="checkbox"
-            tabIndex={-1}
-          >
-            <td
-              aria-sort={null}
-              className="MuiTableCell-root-146 MuiTableCell-body-148 MuiTableCell-paddingCheckbox-152"
-              onClick={[Function]}
-            >
-              <span
-                className="MuiButtonBase-root-127 MuiIconButton-root-121 MuiPrivateSwitchBase-root-164 MuiCheckbox-root-158 MuiCheckbox-colorPrimary-162"
-                onBlur={[Function]}
-                onContextMenu={[Function]}
-                onFocus={[Function]}
-                onKeyDown={[Function]}
-                onKeyUp={[Function]}
-                onMouseDown={[Function]}
-                onMouseLeave={[Function]}
-                onMouseUp={[Function]}
-                onTouchEnd={[Function]}
-                onTouchMove={[Function]}
-                onTouchStart={[Function]}
-                tabIndex={null}
-              >
-                <span
-                  className="MuiIconButton-label-126"
-                >
-                  <svg
-                    aria-hidden="true"
-                    className="MuiSvgIcon-root-130"
-                    focusable="false"
-                    role="presentation"
-                    viewBox="0 0 24 24"
-                  >
-                    <path
-                      d="M19 5v14H5V5h14m0-2H5c-1.1 0-2 .9-2 2v14c0 1.1.9 2 2 2h14c1.1 0 2-.9 2-2V5c0-1.1-.9-2-2-2z"
-                    />
-                  </svg>
-                  <input
-                    checked={false}
-                    className="MuiPrivateSwitchBase-input-167"
-                    data-indeterminate={false}
-                    onChange={[Function]}
-                    type="checkbox"
-                  />
-                </span>
-                <span
-                  className="MuiTouchRipple-root-196"
-                />
-              </span>
-            </td>
-            <td
-              aria-sort={null}
-              className="MuiTableCell-root-146 MuiTableCell-body-148 MuiTableCell-paddingNone-153"
-              onClick={[Function]}
-            >
-              Mrs. Dennis Schulist
-            </td>
-            <td
-              aria-sort={null}
-              className="MuiTableCell-root-146 MuiTableCell-body-148 MuiTableCell-paddingNone-153"
-              onClick={[Function]}
-            >
-              Leopoldo_Corkery
-            </td>
-            <td
-              aria-sort={null}
-              className="MuiTableCell-root-146 MuiTableCell-body-148 MuiTableCell-alignRight-156"
-              onClick={[Function]}
-            >
-              1-477-935-8478 x6430
-            </td>
-            <td
-              aria-sort={null}
-              className="MuiTableCell-root-146 MuiTableCell-body-148 MuiTableCell-paddingNone-153"
-              onClick={[Function]}
-            >
-              <a
-                href="http://ola.org"
-              >
-                ola.org
-              </a>
-            </td>
-            <td
-              aria-sort={null}
-              className="MuiTableCell-root-146 MuiTableCell-body-148 MuiTableCell-paddingNone-153"
-              onClick={[Function]}
-            >
-              Considine-Lockman
-            </td>
-          </tr>
-          <tr
-            aria-checked={false}
-            className="MuiTableRow-root-141 MuiTableRow-hover-143"
-            onKeyDown={[Function]}
-            role="checkbox"
-            tabIndex={-1}
-          >
-            <td
-              aria-sort={null}
-              className="MuiTableCell-root-146 MuiTableCell-body-148 MuiTableCell-paddingCheckbox-152"
-              onClick={[Function]}
-            >
-              <span
-                className="MuiButtonBase-root-127 MuiIconButton-root-121 MuiPrivateSwitchBase-root-164 MuiCheckbox-root-158 MuiCheckbox-colorPrimary-162"
-                onBlur={[Function]}
-                onContextMenu={[Function]}
-                onFocus={[Function]}
-                onKeyDown={[Function]}
-                onKeyUp={[Function]}
-                onMouseDown={[Function]}
-                onMouseLeave={[Function]}
-                onMouseUp={[Function]}
-                onTouchEnd={[Function]}
-                onTouchMove={[Function]}
-                onTouchStart={[Function]}
-                tabIndex={null}
-              >
-                <span
-                  className="MuiIconButton-label-126"
-                >
-                  <svg
-                    aria-hidden="true"
-                    className="MuiSvgIcon-root-130"
-                    focusable="false"
-                    role="presentation"
-                    viewBox="0 0 24 24"
-                  >
-                    <path
-                      d="M19 5v14H5V5h14m0-2H5c-1.1 0-2 .9-2 2v14c0 1.1.9 2 2 2h14c1.1 0 2-.9 2-2V5c0-1.1-.9-2-2-2z"
-                    />
-                  </svg>
-                  <input
-                    checked={false}
-                    className="MuiPrivateSwitchBase-input-167"
-                    data-indeterminate={false}
-                    onChange={[Function]}
-                    type="checkbox"
-                  />
-                </span>
-                <span
-                  className="MuiTouchRipple-root-196"
-                />
-              </span>
-            </td>
-            <td
-              aria-sort={null}
-              className="MuiTableCell-root-146 MuiTableCell-body-148 MuiTableCell-paddingNone-153"
-              onClick={[Function]}
-            >
-              Nicholas Runolfsdottir V
-            </td>
-            <td
-              aria-sort={null}
-              className="MuiTableCell-root-146 MuiTableCell-body-148 MuiTableCell-paddingNone-153"
-              onClick={[Function]}
-            >
-              Maxime_Nienow
-            </td>
-            <td
-              aria-sort={null}
-              className="MuiTableCell-root-146 MuiTableCell-body-148 MuiTableCell-alignRight-156"
-              onClick={[Function]}
-            >
-              586.493.6943 x140
-            </td>
-            <td
-              aria-sort={null}
-              className="MuiTableCell-root-146 MuiTableCell-body-148 MuiTableCell-paddingNone-153"
-              onClick={[Function]}
-            >
-              <a
-                href="http://jacynthe.com"
-              >
-                jacynthe.com
-              </a>
-            </td>
-            <td
-              aria-sort={null}
-              className="MuiTableCell-root-146 MuiTableCell-body-148 MuiTableCell-paddingNone-153"
-              onClick={[Function]}
-            >
-              Abernathy Group
-            </td>
-          </tr>
-          <tr
-            aria-checked={false}
-            className="MuiTableRow-root-141 MuiTableRow-hover-143"
-            onKeyDown={[Function]}
-            role="checkbox"
-            tabIndex={-1}
-          >
-            <td
-              aria-sort={null}
-              className="MuiTableCell-root-146 MuiTableCell-body-148 MuiTableCell-paddingCheckbox-152"
-              onClick={[Function]}
-            >
-              <span
-                className="MuiButtonBase-root-127 MuiIconButton-root-121 MuiPrivateSwitchBase-root-164 MuiCheckbox-root-158 MuiCheckbox-colorPrimary-162"
-                onBlur={[Function]}
-                onContextMenu={[Function]}
-                onFocus={[Function]}
-                onKeyDown={[Function]}
-                onKeyUp={[Function]}
-                onMouseDown={[Function]}
-                onMouseLeave={[Function]}
-                onMouseUp={[Function]}
-                onTouchEnd={[Function]}
-                onTouchMove={[Function]}
-                onTouchStart={[Function]}
-                tabIndex={null}
-              >
-                <span
-                  className="MuiIconButton-label-126"
-                >
-                  <svg
-                    aria-hidden="true"
-                    className="MuiSvgIcon-root-130"
-                    focusable="false"
-                    role="presentation"
-                    viewBox="0 0 24 24"
-                  >
-                    <path
-                      d="M19 5v14H5V5h14m0-2H5c-1.1 0-2 .9-2 2v14c0 1.1.9 2 2 2h14c1.1 0 2-.9 2-2V5c0-1.1-.9-2-2-2z"
-                    />
-                  </svg>
-                  <input
-                    checked={false}
-                    className="MuiPrivateSwitchBase-input-167"
-                    data-indeterminate={false}
-                    onChange={[Function]}
-                    type="checkbox"
-                  />
-                </span>
-                <span
-                  className="MuiTouchRipple-root-196"
-                />
-              </span>
-            </td>
-            <td
-              aria-sort={null}
-              className="MuiTableCell-root-146 MuiTableCell-body-148 MuiTableCell-paddingNone-153"
-              onClick={[Function]}
-            >
-              Clementina DuBuque
-            </td>
-            <td
-              aria-sort={null}
-              className="MuiTableCell-root-146 MuiTableCell-body-148 MuiTableCell-paddingNone-153"
-              onClick={[Function]}
-            >
-              Moriah.Stanton
-            </td>
-            <td
-              aria-sort={null}
-              className="MuiTableCell-root-146 MuiTableCell-body-148 MuiTableCell-alignRight-156"
-              onClick={[Function]}
-            >
-              024-648-3804
-            </td>
-            <td
-              aria-sort={null}
-              className="MuiTableCell-root-146 MuiTableCell-body-148 MuiTableCell-paddingNone-153"
-              onClick={[Function]}
-            >
-              <a
-                href="http://ambrose.net"
-              >
-                ambrose.net
-              </a>
-            </td>
-            <td
-              aria-sort={null}
-              className="MuiTableCell-root-146 MuiTableCell-body-148 MuiTableCell-paddingNone-153"
-              onClick={[Function]}
-            >
-              Hoeger LLC
-            </td>
-          </tr>
-        </tbody>
-        <tfoot
-          className="MuiTableFooter-root-174"
-        >
-          <tr
-            className="MuiTableRow-root-141 MuiTableRow-footer-145"
-          >
-            <td
-              aria-sort={null}
-              className="MuiTableCell-root-146 MuiTableCell-footer-149 MuiTablePagination-root-175"
-              colSpan={1000}
-            >
-              <div
-                className="MuiToolbar-root-36 MuiToolbar-regular-38 MuiToolbar-gutters-37 MuiTablePagination-toolbar-176"
-              >
-                <div
-                  className="MuiTablePagination-spacer-177"
-                />
-                <span
-                  className="MuiTypography-root-40 MuiTypography-caption-50 MuiTypography-colorInherit-69 MuiTablePagination-caption-178"
-                >
-                  Rows per page:
-                </span>
-                <div
-                  className="MuiInputBase-root-96 MuiTablePagination-input-182"
-                  onClick={[Function]}
-                >
-                  <div
-                    className="MuiSelect-root-185 MuiTablePagination-selectRoot-179"
-                  >
-                    <div
-                      aria-haspopup="true"
-                      aria-pressed="false"
-                      className="MuiSelect-select-186 MuiTablePagination-select-180 MuiSelect-selectMenu-189 MuiInputBase-input-106"
-                      onBlur={[Function]}
-                      onClick={[Function]}
-                      onFocus={[Function]}
-                      onKeyDown={[Function]}
-                      role="button"
-                      tabIndex={0}
-                    >
-                      10
-                    </div>
-                    <input
-                      type="hidden"
-                      value={10}
-                    />
-                    <svg
-                      aria-hidden="true"
-                      className="MuiSvgIcon-root-130 MuiSelect-icon-191 MuiTablePagination-selectIcon-181"
-                      focusable="false"
-                      role="presentation"
-                      viewBox="0 0 24 24"
-                    >
-                      <path
-                        d="M7 10l5 5 5-5z"
-                      />
-                    </svg>
-                  </div>
-                </div>
-                <span
-                  className="MuiTypography-root-40 MuiTypography-caption-50 MuiTypography-colorInherit-69 MuiTablePagination-caption-178"
-                >
-                  1-10 of 11
-                </span>
-                <div
-                  className="MuiTablePagination-actions-184"
-                >
-                  <button
-                    className="MuiButtonBase-root-127 MuiButtonBase-disabled-128 MuiIconButton-root-121 MuiIconButton-colorInherit-122 MuiIconButton-disabled-125"
-                    disabled={true}
-                    onBlur={[Function]}
-                    onClick={[Function]}
-                    onContextMenu={[Function]}
-                    onFocus={[Function]}
-                    onKeyDown={[Function]}
-                    onKeyUp={[Function]}
-                    onMouseDown={[Function]}
-                    onMouseLeave={[Function]}
-                    onMouseUp={[Function]}
-                    onTouchEnd={[Function]}
-                    onTouchMove={[Function]}
-                    onTouchStart={[Function]}
-                    tabIndex="-1"
-                    type="button"
-                  >
-                    <span
-                      className="MuiIconButton-label-126"
-                    >
-                      <svg
-                        aria-hidden="true"
-                        className="MuiSvgIcon-root-130"
-                        focusable="false"
-                        role="presentation"
-                        viewBox="0 0 24 24"
-                      >
-                        <path
-                          d="M15.41 16.09l-4.58-4.59 4.58-4.59L14 5.5l-6 6 6 6z"
-                        />
-                      </svg>
-                    </span>
-                  </button>
-                  <button
-                    className="MuiButtonBase-root-127 MuiIconButton-root-121 MuiIconButton-colorInherit-122"
-                    disabled={false}
-                    onBlur={[Function]}
-                    onClick={[Function]}
-                    onContextMenu={[Function]}
-                    onFocus={[Function]}
-                    onKeyDown={[Function]}
-                    onKeyUp={[Function]}
-                    onMouseDown={[Function]}
-                    onMouseLeave={[Function]}
-                    onMouseUp={[Function]}
-                    onTouchEnd={[Function]}
-                    onTouchMove={[Function]}
-                    onTouchStart={[Function]}
-                    tabIndex="0"
-                    type="button"
-                  >
-                    <span
-                      className="MuiIconButton-label-126"
-                    >
-                      <svg
-                        aria-hidden="true"
-                        className="MuiSvgIcon-root-130"
-                        focusable="false"
-                        role="presentation"
-                        viewBox="0 0 24 24"
-                      >
-                        <path
-                          d="M8.59 16.34l4.58-4.59-4.58-4.59L10 5.75l6 6-6 6z"
-                        />
-                      </svg>
-                    </span>
-                    <span
-                      className="MuiTouchRipple-root-196"
-                    />
-                  </button>
-                </div>
-              </div>
-            </td>
-          </tr>
-        </tfoot>
-      </table>
-    </div>
-  </div>
+  <WithStyles(ListingBranch)
+    data={
+      Array [
+        Object {
+          "address": Object {
+            "city": "Wisokyburgh",
+            "geo": Object {
+              "lat": "-43.9509",
+              "lng": "-34.4618",
+            },
+            "street": "Victor Plains",
+            "suite": "Suite 879",
+            "zipcode": "90566-7771",
+          },
+          "company": Object {
+            "bs": "synergize scalable supply-chains",
+            "catchPhrase": "Proactive didactic contingency",
+            "name": "Deckow-Crist",
+          },
+          "email": "Shanna@melissa.tv",
+          "id": 2,
+          "name": "Ervin Howell",
+          "phone": "010-692-6593 x09125",
+          "username": "Antonette",
+          "website": "anastasia.net",
+        },
+        Object {
+          "address": Object {
+            "city": "Gwenborough",
+            "geo": Object {
+              "lat": "-37.3159",
+              "lng": "81.1496",
+            },
+            "street": "Kulas Light",
+            "suite": "Apt. 556",
+            "zipcode": "92998-3874",
+          },
+          "company": Object {
+            "bs": "harness real-time e-markets",
+            "catchPhrase": "Multi-layered client-server neural-net",
+            "name": "Romaguera-Crona",
+          },
+          "email": "Sincere@april.biz",
+          "id": 1,
+          "name": "Leanne Graham",
+          "phone": "1-770-736-8031 x56442",
+          "username": "Bret",
+          "website": "hildegard.org",
+        },
+        Object {
+          "address": Object {
+            "city": "Lebsackbury",
+            "geo": Object {
+              "lat": "-38.2386",
+              "lng": "57.2232",
+            },
+            "street": "Kattie Turnpike",
+            "suite": "Suite 198",
+            "zipcode": "31428-2261",
+          },
+          "company": Object {
+            "bs": "target end-to-end models",
+            "catchPhrase": "Centralized empowering task-force",
+            "name": "Hoeger LLC",
+          },
+          "email": "Dan.Schulist@karina.biz",
+          "id": 11,
+          "name": "Mr. Dan Schulist",
+          "phone": "024-648-3804",
+          "username": "Dan.Schulist",
+          "website": "ambrose.net",
+        },
+        Object {
+          "address": Object {
+            "city": "Bartholomebury",
+            "geo": Object {
+              "lat": "24.6463",
+              "lng": "-168.8889",
+            },
+            "street": "Dayna Park",
+            "suite": "Suite 449",
+            "zipcode": "76495-3109",
+          },
+          "company": Object {
+            "bs": "aggregate real-time technologies",
+            "catchPhrase": "Switchable contextually-based project",
+            "name": "Yost and Sons",
+          },
+          "email": "Chaim_McDermott@dana.io",
+          "id": 9,
+          "name": "Glenna Reichert",
+          "phone": "(775)976-6794 x41206",
+          "username": "Delphine",
+          "website": "conrad.com",
+        },
+        Object {
+          "address": Object {
+            "city": "Howemouth",
+            "geo": Object {
+              "lat": "24.8918",
+              "lng": "21.8984",
+            },
+            "street": "Rex Trail",
+            "suite": "Suite 280",
+            "zipcode": "58804-1099",
+          },
+          "company": Object {
+            "bs": "generate enterprise e-tailers",
+            "catchPhrase": "Configurable multimedia task-force",
+            "name": "Johns Group",
+          },
+          "email": "Telly.Hoeger@billy.biz",
+          "id": 7,
+          "name": "Kurtis Weissnat",
+          "phone": "210.067.6132",
+          "username": "Elwyn.Skiles",
+          "website": "elvis.io",
+        },
+        Object {
+          "address": Object {
+            "city": "Roscoeview",
+            "geo": Object {
+              "lat": "-31.8129",
+              "lng": "62.5342",
+            },
+            "street": "Skiles Walks",
+            "suite": "Suite 351",
+            "zipcode": "33263",
+          },
+          "company": Object {
+            "bs": "revolutionize end-to-end systems",
+            "catchPhrase": "User-centric fault-tolerant solution",
+            "name": "Keebler LLC",
+          },
+          "email": "Lucio_Hettinger@annie.ca",
+          "id": 5,
+          "name": "Chelsey Dietrich",
+          "phone": "(254)954-1289",
+          "username": "Kamren",
+          "website": "demarco.info",
+        },
+        Object {
+          "address": Object {
+            "city": "South Elvis",
+            "geo": Object {
+              "lat": "29.4572",
+              "lng": "-164.2990",
+            },
+            "street": "Hoeger Mall",
+            "suite": "Apt. 692",
+            "zipcode": "53919-4257",
+          },
+          "company": Object {
+            "bs": "transition cutting-edge web services",
+            "catchPhrase": "Multi-tiered zero tolerance productivity",
+            "name": "Robel-Corkery",
+          },
+          "email": "Julianne.OConner@kory.org",
+          "id": 4,
+          "name": "Patricia Lebsack",
+          "phone": "493-170-9623 x156",
+          "username": "Karianne",
+          "website": "kale.biz",
+        },
+        Object {
+          "address": Object {
+            "city": "South Christy",
+            "geo": Object {
+              "lat": "-71.4197",
+              "lng": "71.7478",
+            },
+            "street": "Norberto Crossing",
+            "suite": "Apt. 950",
+            "zipcode": "23505-1337",
+          },
+          "company": Object {
+            "bs": "e-enable innovative applications",
+            "catchPhrase": "Synchronised bottom-line interface",
+            "name": "Considine-Lockman",
+          },
+          "email": "Karley_Dach@jasper.info",
+          "id": 6,
+          "name": "Mrs. Dennis Schulist",
+          "phone": "1-477-935-8478 x6430",
+          "username": "Leopoldo_Corkery",
+          "website": "ola.org",
+        },
+        Object {
+          "address": Object {
+            "city": "Aliyaview",
+            "geo": Object {
+              "lat": "-14.3990",
+              "lng": "-120.7677",
+            },
+            "street": "Ellsworth Summit",
+            "suite": "Suite 729",
+            "zipcode": "45169",
+          },
+          "company": Object {
+            "bs": "e-enable extensible e-tailers",
+            "catchPhrase": "Implemented secondary concept",
+            "name": "Abernathy Group",
+          },
+          "email": "Sherwood@rosamond.me",
+          "id": 8,
+          "name": "Nicholas Runolfsdottir V",
+          "phone": "586.493.6943 x140",
+          "username": "Maxime_Nienow",
+          "website": "jacynthe.com",
+        },
+        Object {
+          "address": Object {
+            "city": "Lebsackbury",
+            "geo": Object {
+              "lat": "-38.2386",
+              "lng": "57.2232",
+            },
+            "street": "Kattie Turnpike",
+            "suite": "Suite 198",
+            "zipcode": "31428-2261",
+          },
+          "company": Object {
+            "bs": "target end-to-end models",
+            "catchPhrase": "Centralized empowering task-force",
+            "name": "Hoeger LLC",
+          },
+          "email": "Rey.Padberg@karina.biz",
+          "id": 10,
+          "name": "Clementina DuBuque",
+          "phone": "024-648-3804",
+          "username": "Moriah.Stanton",
+          "website": "ambrose.net",
+        },
+        Object {
+          "address": Object {
+            "city": "McKenziehaven",
+            "geo": Object {
+              "lat": "-68.6102",
+              "lng": "-47.0653",
+            },
+            "street": "Douglas Extension",
+            "suite": "Suite 847",
+            "zipcode": "59590-4157",
+          },
+          "company": Object {
+            "bs": "e-enable strategic applications",
+            "catchPhrase": "Face to face bifurcated interface",
+            "name": "Romaguera-Jacobson",
+          },
+          "email": "Nathan@yesenia.net",
+          "id": 3,
+          "name": "Clementine Bauch",
+          "phone": "1-463-123-4447",
+          "username": "Samantha",
+          "website": "ramiro.info",
+        },
+      ]
+    }
+    handleChangePage={[Function]}
+    handleChangeRowsPerPage={[Function]}
+    handleCheckClick={[Function]}
+    handleKeyDown={[Function]}
+    handleRequestSort={[Function]}
+    handleSelectAllClick={[Function]}
+    hasLoader={true}
+    headers={
+      Array [
+        Object {
+          "id": "name",
+          "isPaddingDisabled": true,
+          "isSearchable": true,
+          "label": "Name",
+        },
+        Object {
+          "id": "username",
+          "isPaddingDisabled": true,
+          "isSearchable": true,
+          "label": "Username",
+        },
+        Object {
+          "id": "phone",
+          "isNumeric": true,
+          "isPaddingDisabled": false,
+          "isSearchable": true,
+          "label": "Phone",
+        },
+        Object {
+          "id": "website",
+          "isPaddingDisabled": true,
+          "label": "Website",
+          "transformContent": [Function],
+        },
+        Object {
+          "id": "company",
+          "isPaddingDisabled": true,
+          "isSearchable": true,
+          "label": "Company",
+          "transformContent": [Function],
+        },
+      ]
+    }
+    id={null}
+    isSelected={[Function]}
+    onClick={[Function]}
+    onFilter={[Function]}
+    onUpdateSelection={[Function]}
+    order="asc"
+    orderBy="username"
+    origData={null}
+    page={0}
+    rowsPerPage={10}
+    searchable={
+      Array [
+        "name",
+        "username",
+        "phone",
+        "company",
+      ]
+    }
+    selected={Array []}
+    title="Christmas Time"
+    toolbarContent={<React.Fragment />}
+  />
 </div>
 `;
diff --git a/src/Listing/__snapshots__/ListingHeader.test.jsx.snap b/src/Listing/__snapshots__/ListingHeader.test.jsx.snap
index bd551de..18a4482 100644
--- a/src/Listing/__snapshots__/ListingHeader.test.jsx.snap
+++ b/src/Listing/__snapshots__/ListingHeader.test.jsx.snap
@@ -1,105 +1,28 @@
 // Jest Snapshot v1, https://goo.gl/fbAQLP
 
 exports[`renders correctly 1`] = `
-<table
-  className="MuiTable-root-1"
+<ForwardRef(Table)
+  classes={
+    Object {
+      "root": "MuiTable-root",
+    }
+  }
 >
-  <thead
-    className="MuiTableHead-root-2"
-  >
-    <tr
-      className="MuiTableRow-root-3 MuiTableRow-head-6"
-    >
-      <th
-        aria-sort={null}
-        className="MuiTableCell-root-8 MuiTableCell-head-9 MuiTableCell-paddingCheckbox-14"
-        scope="col"
-      >
-        <span
-          className="MuiButtonBase-root-36 MuiIconButton-root-30 MuiPrivateSwitchBase-root-26 MuiCheckbox-root-20 MuiCheckbox-colorPrimary-24 MuiPrivateSwitchBase-checked-27 MuiCheckbox-checked-21"
-          onBlur={[Function]}
-          onContextMenu={[Function]}
-          onFocus={[Function]}
-          onKeyDown={[Function]}
-          onKeyUp={[Function]}
-          onMouseDown={[Function]}
-          onMouseLeave={[Function]}
-          onMouseUp={[Function]}
-          onTouchEnd={[Function]}
-          onTouchMove={[Function]}
-          onTouchStart={[Function]}
-          tabIndex={null}
-        >
-          <span
-            className="MuiIconButton-label-35"
-          >
-            <svg
-              aria-hidden="true"
-              className="MuiSvgIcon-root-39"
-              focusable="false"
-              role="presentation"
-              viewBox="0 0 24 24"
-            >
-              <path
-                d="M19 3H5c-1.11 0-2 .9-2 2v14c0 1.1.89 2 2 2h14c1.11 0 2-.9 2-2V5c0-1.1-.89-2-2-2zm-9 14l-5-5 1.41-1.41L10 14.17l7.59-7.59L19 8l-9 9z"
-              />
-            </svg>
-            <input
-              checked={true}
-              className="MuiPrivateSwitchBase-input-29"
-              data-indeterminate={false}
-              onChange={[Function]}
-              type="checkbox"
-            />
-          </span>
-          <span
-            className="MuiTouchRipple-root-61"
-          />
-        </span>
-      </th>
-      <th
-        aria-sort={null}
-        className="MuiTableCell-root-8 MuiTableCell-head-9"
-        scope="col"
-      >
-        Array [
-          <span
-            aria-describedby={null}
-            className="MuiButtonBase-root-36 MuiTableSortLabel-root-56 MuiTableSortLabel-active-57"
-            onBlur={[Function]}
-            onClick={[Function]}
-            onContextMenu={[Function]}
-            onFocus={[Function]}
-            onKeyDown={[Function]}
-            onKeyUp={[Function]}
-            onMouseDown={[Function]}
-            onMouseLeave={[Function]}
-            onMouseOver={[Function]}
-            onMouseUp={[Function]}
-            onTouchEnd={[Function]}
-            onTouchMove={[Function]}
-            onTouchStart={[Function]}
-            role="button"
-            tabIndex="0"
-            title="Sort"
-          >
-            Name
-            <svg
-              aria-hidden="true"
-              className="MuiSvgIcon-root-39 MuiTableSortLabel-icon-58 MuiTableSortLabel-iconDirectionAsc-60"
-              focusable="false"
-              role="presentation"
-              viewBox="0 0 24 24"
-            >
-              <path
-                d="M20 12l-1.41-1.41L13 16.17V4h-2v12.17l-5.58-5.59L4 12l8 8 8-8z"
-              />
-            </svg>
-          </span>,
-          "",
-        ]
-      </th>
-    </tr>
-  </thead>
-</table>
+  <ListingHeader
+    headers={
+      Array [
+        Object {
+          "id": "name",
+          "label": "Name",
+        },
+      ]
+    }
+    numSelected={0}
+    onRequestSort={[Function]}
+    onSelectAllClick={[Function]}
+    order="asc"
+    orderBy="name"
+    rowCount={0}
+  />
+</ForwardRef(Table)>
 `;
diff --git a/src/Listing/__snapshots__/ListingLine.test.jsx.snap b/src/Listing/__snapshots__/ListingLine.test.jsx.snap
index 2b3dd37..a030be8 100644
--- a/src/Listing/__snapshots__/ListingLine.test.jsx.snap
+++ b/src/Listing/__snapshots__/ListingLine.test.jsx.snap
@@ -1,235 +1,127 @@
 // Jest Snapshot v1, https://goo.gl/fbAQLP
 
 exports[`renders correctly 1`] = `
-<table
-  className="MuiTable-root-1"
+<ForwardRef(Table)
+  classes={
+    Object {
+      "root": "MuiTable-root",
+    }
+  }
 >
-  <tr
-    aria-checked={false}
-    className="MuiTableRow-root-2 MuiTableRow-hover-4"
-    onKeyDown={[Function]}
-    role="checkbox"
-    tabIndex={-1}
-  >
-    <td
-      aria-sort={null}
-      className="MuiTableCell-root-7 MuiTableCell-paddingCheckbox-13"
-      onClick={[Function]}
-    >
-      <span
-        className="MuiButtonBase-root-35 MuiIconButton-root-29 MuiPrivateSwitchBase-root-25 MuiCheckbox-root-19 MuiCheckbox-colorPrimary-23"
-        onBlur={[Function]}
-        onContextMenu={[Function]}
-        onFocus={[Function]}
-        onKeyDown={[Function]}
-        onKeyUp={[Function]}
-        onMouseDown={[Function]}
-        onMouseLeave={[Function]}
-        onMouseUp={[Function]}
-        onTouchEnd={[Function]}
-        onTouchMove={[Function]}
-        onTouchStart={[Function]}
-        tabIndex={null}
-      >
-        <span
-          className="MuiIconButton-label-34"
-        >
-          <svg
-            aria-hidden="true"
-            className="MuiSvgIcon-root-38"
-            focusable="false"
-            role="presentation"
-            viewBox="0 0 24 24"
-          >
-            <path
-              d="M19 5v14H5V5h14m0-2H5c-1.1 0-2 .9-2 2v14c0 1.1.9 2 2 2h14c1.1 0 2-.9 2-2V5c0-1.1-.9-2-2-2z"
-            />
-          </svg>
-          <input
-            checked={false}
-            className="MuiPrivateSwitchBase-input-28"
-            data-indeterminate={false}
-            onChange={[Function]}
-            type="checkbox"
-          />
-        </span>
-        <span
-          className="MuiTouchRipple-root-47"
-        />
-      </span>
-    </td>
-    <td
-      aria-sort={null}
-      className="MuiTableCell-root-7 MuiTableCell-paddingNone-14"
-      onClick={[Function]}
-    >
-      Leanne Graham
-    </td>
-    <td
-      aria-sort={null}
-      className="MuiTableCell-root-7 MuiTableCell-paddingNone-14"
-      onClick={[Function]}
-    >
-      Bret
-    </td>
-  </tr>
-</table>
+  <ListingLine
+    data={
+      Object {
+        "id": 1,
+        "name": "Leanne Graham",
+        "username": "Bret",
+      }
+    }
+    handleCheckClick={[Function]}
+    handleKeyDown={[Function]}
+    headers={
+      Array [
+        Object {
+          "id": "name",
+          "isPaddingDisabled": true,
+          "isSearchable": true,
+          "label": "Name",
+        },
+        Object {
+          "id": "username",
+          "isPaddingDisabled": true,
+          "isSearchable": true,
+          "label": "Username",
+        },
+      ]
+    }
+    isSelected={false}
+    onClick={[Function]}
+  />
+</ForwardRef(Table)>
 `;
 
 exports[`renders highlighted 1`] = `
-<table
-  className="MuiTable-root-1"
+<ForwardRef(Table)
+  classes={
+    Object {
+      "root": "MuiTable-root",
+    }
+  }
 >
-  <tr
-    aria-checked={true}
-    className="MuiTableRow-root-2 MuiTableRow-hover-4 MuiTableRow-selected-3"
-    onKeyDown={[Function]}
-    role="checkbox"
-    tabIndex={-1}
-  >
-    <td
-      aria-sort={null}
-      className="MuiTableCell-root-7 MuiTableCell-paddingCheckbox-13"
-      onClick={[Function]}
-    >
-      <span
-        className="MuiButtonBase-root-35 MuiIconButton-root-29 MuiPrivateSwitchBase-root-25 MuiCheckbox-root-19 MuiCheckbox-colorPrimary-23 MuiPrivateSwitchBase-checked-26 MuiCheckbox-checked-20"
-        onBlur={[Function]}
-        onContextMenu={[Function]}
-        onFocus={[Function]}
-        onKeyDown={[Function]}
-        onKeyUp={[Function]}
-        onMouseDown={[Function]}
-        onMouseLeave={[Function]}
-        onMouseUp={[Function]}
-        onTouchEnd={[Function]}
-        onTouchMove={[Function]}
-        onTouchStart={[Function]}
-        tabIndex={null}
-      >
-        <span
-          className="MuiIconButton-label-34"
-        >
-          <svg
-            aria-hidden="true"
-            className="MuiSvgIcon-root-38"
-            focusable="false"
-            role="presentation"
-            viewBox="0 0 24 24"
-          >
-            <path
-              d="M19 3H5c-1.11 0-2 .9-2 2v14c0 1.1.89 2 2 2h14c1.11 0 2-.9 2-2V5c0-1.1-.89-2-2-2zm-9 14l-5-5 1.41-1.41L10 14.17l7.59-7.59L19 8l-9 9z"
-            />
-          </svg>
-          <input
-            checked={true}
-            className="MuiPrivateSwitchBase-input-28"
-            data-indeterminate={false}
-            onChange={[Function]}
-            type="checkbox"
-          />
-        </span>
-        <span
-          className="MuiTouchRipple-root-47"
-        />
-      </span>
-    </td>
-    <td
-      aria-sort={null}
-      className="MuiTableCell-root-7 MuiTableCell-paddingNone-14"
-      dangerouslySetInnerHTML={
-        Object {
-          "__html": "<span style=\\"background-color: yellow;\\">Lea</span>nne Graham",
-        }
+  <ListingLine
+    data={
+      Object {
+        "id": 1,
+        "name": Object {
+          "highlight": "Lea",
+          "value": "Leanne Graham",
+        },
+        "username": Object {
+          "highlight": "Bret",
+          "value": "Leanne Graham",
+        },
       }
-      onClick={[Function]}
-    />
-    <td
-      aria-sort={null}
-      className="MuiTableCell-root-7 MuiTableCell-paddingNone-14"
-      dangerouslySetInnerHTML={
+    }
+    handleCheckClick={[Function]}
+    handleKeyDown={[Function]}
+    headers={
+      Array [
         Object {
-          "__html": "Leanne Graham",
-        }
-      }
-      onClick={[Function]}
-    />
-  </tr>
-</table>
+          "id": "name",
+          "isPaddingDisabled": true,
+          "isSearchable": true,
+          "label": "Name",
+        },
+        Object {
+          "id": "username",
+          "isPaddingDisabled": true,
+          "isSearchable": true,
+          "label": "Username",
+        },
+      ]
+    }
+    isSelected={true}
+    onClick={[Function]}
+  />
+</ForwardRef(Table)>
 `;
 
 exports[`renders selected 1`] = `
-<table
-  className="MuiTable-root-1"
+<ForwardRef(Table)
+  classes={
+    Object {
+      "root": "MuiTable-root",
+    }
+  }
 >
-  <tr
-    aria-checked={true}
-    className="MuiTableRow-root-2 MuiTableRow-hover-4 MuiTableRow-selected-3"
-    onKeyDown={[Function]}
-    role="checkbox"
-    tabIndex={-1}
-  >
-    <td
-      aria-sort={null}
-      className="MuiTableCell-root-7 MuiTableCell-paddingCheckbox-13"
-      onClick={[Function]}
-    >
-      <span
-        className="MuiButtonBase-root-35 MuiIconButton-root-29 MuiPrivateSwitchBase-root-25 MuiCheckbox-root-19 MuiCheckbox-colorPrimary-23 MuiPrivateSwitchBase-checked-26 MuiCheckbox-checked-20"
-        onBlur={[Function]}
-        onContextMenu={[Function]}
-        onFocus={[Function]}
-        onKeyDown={[Function]}
-        onKeyUp={[Function]}
-        onMouseDown={[Function]}
-        onMouseLeave={[Function]}
-        onMouseUp={[Function]}
-        onTouchEnd={[Function]}
-        onTouchMove={[Function]}
-        onTouchStart={[Function]}
-        tabIndex={null}
-      >
-        <span
-          className="MuiIconButton-label-34"
-        >
-          <svg
-            aria-hidden="true"
-            className="MuiSvgIcon-root-38"
-            focusable="false"
-            role="presentation"
-            viewBox="0 0 24 24"
-          >
-            <path
-              d="M19 3H5c-1.11 0-2 .9-2 2v14c0 1.1.89 2 2 2h14c1.11 0 2-.9 2-2V5c0-1.1-.89-2-2-2zm-9 14l-5-5 1.41-1.41L10 14.17l7.59-7.59L19 8l-9 9z"
-            />
-          </svg>
-          <input
-            checked={true}
-            className="MuiPrivateSwitchBase-input-28"
-            data-indeterminate={false}
-            onChange={[Function]}
-            type="checkbox"
-          />
-        </span>
-        <span
-          className="MuiTouchRipple-root-47"
-        />
-      </span>
-    </td>
-    <td
-      aria-sort={null}
-      className="MuiTableCell-root-7 MuiTableCell-paddingNone-14"
-      onClick={[Function]}
-    >
-      Leanne Graham
-    </td>
-    <td
-      aria-sort={null}
-      className="MuiTableCell-root-7 MuiTableCell-paddingNone-14"
-      onClick={[Function]}
-    >
-      Bret
-    </td>
-  </tr>
-</table>
+  <ListingLine
+    data={
+      Object {
+        "id": 1,
+        "name": "Leanne Graham",
+        "username": "Bret",
+      }
+    }
+    handleCheckClick={[Function]}
+    handleKeyDown={[Function]}
+    headers={
+      Array [
+        Object {
+          "id": "name",
+          "isPaddingDisabled": true,
+          "isSearchable": true,
+          "label": "Name",
+        },
+        Object {
+          "id": "username",
+          "isPaddingDisabled": true,
+          "isSearchable": true,
+          "label": "Username",
+        },
+      ]
+    }
+    isSelected={true}
+    onClick={[Function]}
+  />
+</ForwardRef(Table)>
 `;
diff --git a/src/Listing/__snapshots__/ListingLoader.test.jsx.snap b/src/Listing/__snapshots__/ListingLoader.test.jsx.snap
index 0cac01f..acc2e94 100644
--- a/src/Listing/__snapshots__/ListingLoader.test.jsx.snap
+++ b/src/Listing/__snapshots__/ListingLoader.test.jsx.snap
@@ -1,32 +1,15 @@
 // Jest Snapshot v1, https://goo.gl/fbAQLP
 
 exports[`renders correctly 1`] = `
-<table
-  className="MuiTable-root-1"
+<ForwardRef(Table)
+  classes={
+    Object {
+      "root": "MuiTable-root",
+    }
+  }
 >
-  <tr
-    className="MuiTableRow-root-5 ListingLoader-row-2"
-  >
-    <td
-      aria-sort={null}
-      className="MuiTableCell-root-10 MuiTableCell-paddingNone-17 ListingLoader-cell-3"
-      colSpan={1}
-    >
-      <div
-        className="MuiLinearProgress-root-22 MuiLinearProgress-colorPrimary-23 MuiLinearProgress-indeterminate-26 ListingLoader-progress-4"
-        mode="query"
-        role="progressbar"
-      >
-        <div
-          className="MuiLinearProgress-bar-32 MuiLinearProgress-barColorPrimary-33 MuiLinearProgress-bar1Indeterminate-35"
-          style={Object {}}
-        />
-        <div
-          className="MuiLinearProgress-bar-32 MuiLinearProgress-barColorPrimary-33 MuiLinearProgress-bar2Indeterminate-38"
-          style={Object {}}
-        />
-      </div>
-    </td>
-  </tr>
-</table>
+  <WithStyles(ListingLoader)
+    cols={1}
+  />
+</ForwardRef(Table)>
 `;
diff --git a/src/Listing/__snapshots__/ListingSearch.test.jsx.snap b/src/Listing/__snapshots__/ListingSearch.test.jsx.snap
index 0389435..9168674 100644
--- a/src/Listing/__snapshots__/ListingSearch.test.jsx.snap
+++ b/src/Listing/__snapshots__/ListingSearch.test.jsx.snap
@@ -1,149 +1,19 @@
 // Jest Snapshot v1, https://goo.gl/fbAQLP
 
 exports[`renders correctly 1`] = `
-<div
-  className="ListingSearchBranch-root-1"
->
-  <div
-    className="MuiFormControl-root-4 ListingSearchBranch-field-2"
-  >
-    <div
-      className="MuiInputBase-root-21 MuiInput-root-8 MuiInput-underline-12 MuiInputBase-formControl-22 MuiInput-formControl-9"
-      onClick={[Function]}
-    >
-      <input
-        aria-invalid={false}
-        className="MuiInputBase-input-31 MuiInput-input-16 MuiInputBase-inputType-34 MuiInput-inputType-19 MuiInputBase-inputTypeSearch-35 MuiInput-inputTypeSearch-20"
-        disabled={false}
-        onBlur={[Function]}
-        onChange={[Function]}
-        onFocus={[Function]}
-        placeholder="Filter"
-        required={false}
-        type="search"
-      />
-    </div>
-  </div>
-  Array [
-    <button
-      aria-describedby={null}
-      className="MuiButtonBase-root-52 MuiIconButton-root-46"
-      disabled={false}
-      onBlur={[Function]}
-      onClick={[Function]}
-      onContextMenu={[Function]}
-      onFocus={[Function]}
-      onKeyDown={[Function]}
-      onKeyUp={[Function]}
-      onMouseDown={[Function]}
-      onMouseLeave={[Function]}
-      onMouseOver={[Function]}
-      onMouseUp={[Function]}
-      onTouchEnd={[Function]}
-      onTouchMove={[Function]}
-      onTouchStart={[Function]}
-      tabIndex="0"
-      title="Search"
-      type="button"
-    >
-      <span
-        className="MuiIconButton-label-51"
-      >
-        <svg
-          aria-hidden="true"
-          className="MuiSvgIcon-root-55"
-          focusable="false"
-          role="presentation"
-          viewBox="0 0 24 24"
-        >
-          <path
-            d="M15.5 14h-.79l-.28-.27C15.41 12.59 16 11.11 16 9.5 16 5.91 13.09 3 9.5 3S3 5.91 3 9.5 5.91 16 9.5 16c1.61 0 3.09-.59 4.23-1.57l.27.28v.79l5 4.99L20.49 19l-4.99-5zm-6 0C7.01 14 5 11.99 5 9.5S7.01 5 9.5 5 14 7.01 14 9.5 11.99 14 9.5 14z"
-          />
-          <path
-            d="M0 0h24v24H0z"
-            fill="none"
-          />
-        </svg>
-      </span>
-      <span
-        className="MuiTouchRipple-root-64"
-      />
-    </button>,
-    "",
-  ]
-</div>
+<WithStyles(ListingSearchBranch)
+  getSearchRef={[Function]}
+  onClick={[Function]}
+  onFilter={[Function]}
+  open={false}
+/>
 `;
 
 exports[`renders correctly when open 1`] = `
-<div
-  className="ListingSearchBranch-root-1"
->
-  <div
-    className="MuiFormControl-root-4 ListingSearchBranch-field-2"
-  >
-    <div
-      className="MuiInputBase-root-21 MuiInput-root-8 MuiInput-underline-12 MuiInputBase-formControl-22 MuiInput-formControl-9"
-      onClick={[Function]}
-    >
-      <input
-        aria-invalid={false}
-        className="MuiInputBase-input-31 MuiInput-input-16 MuiInputBase-inputType-34 MuiInput-inputType-19 MuiInputBase-inputTypeSearch-35 MuiInput-inputTypeSearch-20"
-        disabled={false}
-        onBlur={[Function]}
-        onChange={[Function]}
-        onFocus={[Function]}
-        placeholder="Filter"
-        required={false}
-        type="search"
-      />
-    </div>
-  </div>
-  Array [
-    <button
-      aria-describedby={null}
-      className="MuiButtonBase-root-52 MuiIconButton-root-46"
-      disabled={false}
-      onBlur={[Function]}
-      onClick={[Function]}
-      onContextMenu={[Function]}
-      onFocus={[Function]}
-      onKeyDown={[Function]}
-      onKeyUp={[Function]}
-      onMouseDown={[Function]}
-      onMouseLeave={[Function]}
-      onMouseOver={[Function]}
-      onMouseUp={[Function]}
-      onTouchEnd={[Function]}
-      onTouchMove={[Function]}
-      onTouchStart={[Function]}
-      tabIndex="0"
-      title="Search"
-      type="button"
-    >
-      <span
-        className="MuiIconButton-label-51"
-      >
-        <svg
-          aria-hidden="true"
-          className="MuiSvgIcon-root-55"
-          focusable="false"
-          role="presentation"
-          viewBox="0 0 24 24"
-        >
-          <path
-            d="M15.5 14h-.79l-.28-.27C15.41 12.59 16 11.11 16 9.5 16 5.91 13.09 3 9.5 3S3 5.91 3 9.5 5.91 16 9.5 16c1.61 0 3.09-.59 4.23-1.57l.27.28v.79l5 4.99L20.49 19l-4.99-5zm-6 0C7.01 14 5 11.99 5 9.5S7.01 5 9.5 5 14 7.01 14 9.5 11.99 14 9.5 14z"
-          />
-          <path
-            d="M0 0h24v24H0z"
-            fill="none"
-          />
-        </svg>
-      </span>
-      <span
-        className="MuiTouchRipple-root-64"
-      />
-    </button>,
-    "",
-  ]
-</div>
+<WithStyles(ListingSearchBranch)
+  getSearchRef={[Function]}
+  onClick={[Function]}
+  onFilter={[Function]}
+  open={false}
+/>
 `;
diff --git a/src/Listing/__snapshots__/ListingToolbar.test.jsx.snap b/src/Listing/__snapshots__/ListingToolbar.test.jsx.snap
index bc40a0c..c20caca 100644
--- a/src/Listing/__snapshots__/ListingToolbar.test.jsx.snap
+++ b/src/Listing/__snapshots__/ListingToolbar.test.jsx.snap
@@ -1,93 +1,18 @@
 // Jest Snapshot v1, https://goo.gl/fbAQLP
 
 exports[`renders correctly 1`] = `
-<div
-  className="MuiToolbar-root-6 MuiToolbar-regular-8 MuiToolbar-gutters-7 ListingToolbar-root-1"
->
-  <div
-    className="ListingToolbar-title-5"
-  >
-    <h6
-      className="MuiTypography-root-10 MuiTypography-h6-27"
-    />
-  </div>
-  <div
-    className="ListingToolbar-spacer-3"
-  />
-  <div
-    className="ListingToolbar-actions-4"
-  >
-    <div
-      className="ListingSearchBranch-root-46"
-    >
-      <div
-        className="MuiFormControl-root-49 ListingSearchBranch-field-47"
-      >
-        <div
-          className="MuiInputBase-root-66 MuiInput-root-53 MuiInput-underline-57 MuiInputBase-formControl-67 MuiInput-formControl-54"
-          onClick={[Function]}
-        >
-          <input
-            aria-invalid={false}
-            className="MuiInputBase-input-76 MuiInput-input-61 MuiInputBase-inputType-79 MuiInput-inputType-64 MuiInputBase-inputTypeSearch-80 MuiInput-inputTypeSearch-65"
-            disabled={false}
-            onBlur={[Function]}
-            onChange={[Function]}
-            onFocus={[Function]}
-            placeholder="Filter"
-            required={false}
-            type="search"
-          />
-        </div>
-      </div>
-      Array [
-        <button
-          aria-describedby={null}
-          className="MuiButtonBase-root-97 MuiIconButton-root-91"
-          disabled={false}
-          onBlur={[Function]}
-          onClick={[Function]}
-          onContextMenu={[Function]}
-          onFocus={[Function]}
-          onKeyDown={[Function]}
-          onKeyUp={[Function]}
-          onMouseDown={[Function]}
-          onMouseLeave={[Function]}
-          onMouseOver={[Function]}
-          onMouseUp={[Function]}
-          onTouchEnd={[Function]}
-          onTouchMove={[Function]}
-          onTouchStart={[Function]}
-          tabIndex="0"
-          title="Search"
-          type="button"
-        >
-          <span
-            className="MuiIconButton-label-96"
-          >
-            <svg
-              aria-hidden="true"
-              className="MuiSvgIcon-root-100"
-              focusable="false"
-              role="presentation"
-              viewBox="0 0 24 24"
-            >
-              <path
-                d="M15.5 14h-.79l-.28-.27C15.41 12.59 16 11.11 16 9.5 16 5.91 13.09 3 9.5 3S3 5.91 3 9.5 5.91 16 9.5 16c1.61 0 3.09-.59 4.23-1.57l.27.28v.79l5 4.99L20.49 19l-4.99-5zm-6 0C7.01 14 5 11.99 5 9.5S7.01 5 9.5 5 14 7.01 14 9.5 11.99 14 9.5 14z"
-              />
-              <path
-                d="M0 0h24v24H0z"
-                fill="none"
-              />
-            </svg>
-          </span>
-          <span
-            className="MuiTouchRipple-root-109"
-          />
-        </button>,
-        "",
-      ]
-    </div>
-  </div>
-</div>
+<ListingToolbar
+  classes={
+    Object {
+      "actions": "ListingToolbar-actions-4",
+      "highlight": "ListingToolbar-highlight-2",
+      "root": "ListingToolbar-root-1",
+      "spacer": "ListingToolbar-spacer-3",
+      "title": "ListingToolbar-title-5",
+    }
+  }
+  numSelected={0}
+  onFilter={[Function]}
+  title=""
+/>
 `;
diff --git a/src/Menu/MenuItem.test.jsx b/src/Menu/MenuItem.test.jsx
index f711f7d..c5c9111 100644
--- a/src/Menu/MenuItem.test.jsx
+++ b/src/Menu/MenuItem.test.jsx
@@ -1,12 +1,12 @@
 import React from 'react'
-import { mount } from 'enzyme'
+import { shallow } from 'enzyme'
 
 import Icon from '@material-ui/icons/AccessAlarm'
 
 import MenuItem from './MenuItem'
 
 it('renders correctly', () => {
-  const tree = mount(<MenuItem
+  const tree = shallow(<MenuItem
     title="Title"
     url="/"
     redirectTo={() => {}}
@@ -16,7 +16,7 @@ it('renders correctly', () => {
 })
 
 it('renders correctly with icon', () => {
-  const tree = mount(<MenuItem
+  const tree = shallow(<MenuItem
     title="Title"
     url="/"
     redirectTo={() => { }}
@@ -27,7 +27,7 @@ it('renders correctly with icon', () => {
 })
 
 it('renders correctly disabled', () => {
-  const tree = mount(<MenuItem
+  const tree = shallow(<MenuItem
     title="Title"
     url="/"
     redirectTo={() => {}}
diff --git a/src/Menu/__snapshots__/Menu.test.jsx.snap b/src/Menu/__snapshots__/Menu.test.jsx.snap
index a436ab4..179671f 100644
--- a/src/Menu/__snapshots__/Menu.test.jsx.snap
+++ b/src/Menu/__snapshots__/Menu.test.jsx.snap
@@ -1,61 +1,607 @@
 // Jest Snapshot v1, https://goo.gl/fbAQLP
 
 exports[`renders correctly 1`] = `
-<div
-  className="Menu-root-1"
+<WithStyles(Menu)
+  data={
+    Array [
+      Object {
+        "icon": Object {
+          "$$typeof": Symbol(react.memo),
+          "compare": null,
+          "displayName": "AccessAlarmIcon",
+          "muiName": "SvgIcon",
+          "type": Object {
+            "$$typeof": Symbol(react.forward_ref),
+            "render": [Function],
+          },
+        },
+        "title": "Title",
+        "url": "/",
+      },
+    ]
+  }
+  redirectTo={[Function]}
 >
-  <ul
-    className="MuiList-root-2 MuiList-padding-3"
+  <Menu
+    classes={
+      Object {
+        "root": "Menu-root-1",
+      }
+    }
+    data={
+      Array [
+        Object {
+          "icon": Object {
+            "$$typeof": Symbol(react.memo),
+            "compare": null,
+            "displayName": "AccessAlarmIcon",
+            "muiName": "SvgIcon",
+            "type": Object {
+              "$$typeof": Symbol(react.forward_ref),
+              "render": [Function],
+            },
+          },
+          "title": "Title",
+          "url": "/",
+        },
+      ]
+    }
+    redirectTo={[Function]}
   >
     <div
-      className="MuiButtonBase-root-19 MuiListItem-root-7 MuiListItem-default-10 MuiListItem-gutters-15 MuiListItem-button-16"
-      onBlur={[Function]}
-      onClick={[Function]}
-      onContextMenu={[Function]}
-      onFocus={[Function]}
-      onKeyDown={[Function]}
-      onKeyUp={[Function]}
-      onMouseDown={[Function]}
-      onMouseLeave={[Function]}
-      onMouseUp={[Function]}
-      onTouchEnd={[Function]}
-      onTouchMove={[Function]}
-      onTouchStart={[Function]}
-      role="button"
-      tabIndex="0"
+      className="Menu-root-1"
     >
-      <div
-        className="MuiListItemIcon-root-22"
-      >
-        <svg
-          aria-hidden="true"
-          className="MuiSvgIcon-root-23"
-          focusable="false"
-          role="presentation"
-          viewBox="0 0 24 24"
+      <WithStyles(ForwardRef(List))>
+        <ForwardRef(List)
+          classes={
+            Object {
+              "dense": "MuiList-dense",
+              "padding": "MuiList-padding",
+              "root": "MuiList-root",
+              "subheader": "MuiList-subheader",
+            }
+          }
         >
-          <path
-            d="M0 0h24v24H0z"
-            fill="none"
-          />
-          <path
-            d="M22 5.72l-4.6-3.86-1.29 1.53 4.6 3.86L22 5.72zM7.88 3.39L6.6 1.86 2 5.71l1.29 1.53 4.59-3.85zM12.5 8H11v6l4.75 2.85.75-1.23-4-2.37V8zM12 4c-4.97 0-9 4.03-9 9s4.02 9 9 9c4.97 0 9-4.03 9-9s-4.03-9-9-9zm0 16c-3.87 0-7-3.13-7-7s3.13-7 7-7 7 3.13 7 7-3.13 7-7 7z"
-          />
-        </svg>
-      </div>
-      <div
-        className="MuiListItemText-root-32"
-      >
-        <span
-          className="MuiTypography-root-38 MuiTypography-subheading-45 MuiListItemText-primary-35"
-        >
-          Title
-        </span>
-      </div>
-      <span
-        className="MuiTouchRipple-root-74"
-      />
+          <ul
+            className="MuiList-root MuiList-padding"
+          >
+            <WithStyles(MenuItem)
+              icon={
+                Object {
+                  "$$typeof": Symbol(react.memo),
+                  "compare": null,
+                  "displayName": "AccessAlarmIcon",
+                  "muiName": "SvgIcon",
+                  "type": Object {
+                    "$$typeof": Symbol(react.forward_ref),
+                    "render": [Function],
+                  },
+                }
+              }
+              key="menu-62.98173"
+              redirectTo={[Function]}
+              title="Title"
+              url="/"
+            >
+              <MenuItem
+                classes={
+                  Object {
+                    "isDisabled": "MenuItem-isDisabled-6",
+                  }
+                }
+                icon={
+                  Object {
+                    "$$typeof": Symbol(react.memo),
+                    "compare": null,
+                    "displayName": "AccessAlarmIcon",
+                    "muiName": "SvgIcon",
+                    "type": Object {
+                      "$$typeof": Symbol(react.forward_ref),
+                      "render": [Function],
+                    },
+                  }
+                }
+                isDisabled={false}
+                redirectTo={[Function]}
+                title="Title"
+                url="/"
+              >
+                <WithStyles(ForwardRef(ListItem))
+                  button={true}
+                  className=""
+                  onClick={[Function]}
+                >
+                  <ForwardRef(ListItem)
+                    button={true}
+                    className=""
+                    classes={
+                      Object {
+                        "alignItemsFlexStart": "MuiListItem-alignItemsFlexStart",
+                        "button": "MuiListItem-button",
+                        "container": "MuiListItem-container",
+                        "dense": "MuiListItem-dense",
+                        "disabled": "Mui-disabled",
+                        "divider": "MuiListItem-divider",
+                        "focusVisible": "Mui-focusVisible",
+                        "gutters": "MuiListItem-gutters",
+                        "root": "MuiListItem-root",
+                        "secondaryAction": "MuiListItem-secondaryAction",
+                        "selected": "Mui-selected",
+                      }
+                    }
+                    onClick={[Function]}
+                  >
+                    <WithStyles(ForwardRef(ButtonBase))
+                      className="MuiListItem-root MuiListItem-gutters MuiListItem-button"
+                      component="div"
+                      disabled={false}
+                      focusVisibleClassName="Mui-focusVisible"
+                      onClick={[Function]}
+                    >
+                      <ForwardRef(ButtonBase)
+                        className="MuiListItem-root MuiListItem-gutters MuiListItem-button"
+                        classes={
+                          Object {
+                            "disabled": "Mui-disabled",
+                            "focusVisible": "Mui-focusVisible",
+                            "root": "MuiButtonBase-root",
+                          }
+                        }
+                        component="div"
+                        disabled={false}
+                        focusVisibleClassName="Mui-focusVisible"
+                        onClick={[Function]}
+                      >
+                        <div
+                          aria-disabled={false}
+                          className="MuiButtonBase-root MuiListItem-root MuiListItem-gutters MuiListItem-button"
+                          onBlur={[Function]}
+                          onClick={[Function]}
+                          onFocus={[Function]}
+                          onKeyDown={[Function]}
+                          onKeyUp={[Function]}
+                          onMouseDown={[Function]}
+                          onMouseLeave={[Function]}
+                          onMouseUp={[Function]}
+                          onTouchEnd={[Function]}
+                          onTouchMove={[Function]}
+                          onTouchStart={[Function]}
+                          role="button"
+                          tabIndex={0}
+                        >
+                          <WithStyles(ForwardRef(ListItemIcon))
+                            key=".0"
+                          >
+                            <ForwardRef(ListItemIcon)
+                              classes={
+                                Object {
+                                  "root": "MuiListItemIcon-root",
+                                }
+                              }
+                            >
+                              <div
+                                className="MuiListItemIcon-root"
+                              >
+                                <ForwardRef>
+                                  <WithStyles(ForwardRef(SvgIcon))>
+                                    <ForwardRef(SvgIcon)
+                                      classes={
+                                        Object {
+                                          "colorAction": "MuiSvgIcon-colorAction",
+                                          "colorDisabled": "MuiSvgIcon-colorDisabled",
+                                          "colorError": "MuiSvgIcon-colorError",
+                                          "colorPrimary": "MuiSvgIcon-colorPrimary",
+                                          "colorSecondary": "MuiSvgIcon-colorSecondary",
+                                          "fontSizeInherit": "MuiSvgIcon-fontSizeInherit",
+                                          "fontSizeLarge": "MuiSvgIcon-fontSizeLarge",
+                                          "fontSizeSmall": "MuiSvgIcon-fontSizeSmall",
+                                          "root": "MuiSvgIcon-root",
+                                        }
+                                      }
+                                    >
+                                      <svg
+                                        aria-hidden="true"
+                                        className="MuiSvgIcon-root"
+                                        focusable="false"
+                                        role="presentation"
+                                        viewBox="0 0 24 24"
+                                      >
+                                        <path
+                                          d="M0 0h24v24H0z"
+                                          fill="none"
+                                        />
+                                        <path
+                                          d="M22 5.72l-4.6-3.86-1.29 1.53 4.6 3.86L22 5.72zM7.88 3.39L6.6 1.86 2 5.71l1.29 1.53 4.59-3.85zM12.5 8H11v6l4.75 2.85.75-1.23-4-2.37V8zM12 4c-4.97 0-9 4.03-9 9s4.02 9 9 9c4.97 0 9-4.03 9-9s-4.03-9-9-9zm0 16c-3.87 0-7-3.13-7-7s3.13-7 7-7 7 3.13 7 7-3.13 7-7 7z"
+                                        />
+                                      </svg>
+                                    </ForwardRef(SvgIcon)>
+                                  </WithStyles(ForwardRef(SvgIcon))>
+                                </ForwardRef>
+                              </div>
+                            </ForwardRef(ListItemIcon)>
+                          </WithStyles(ForwardRef(ListItemIcon))>
+                          <WithStyles(ForwardRef(ListItemText))
+                            key=".1"
+                            primary="Title"
+                          >
+                            <ForwardRef(ListItemText)
+                              classes={
+                                Object {
+                                  "dense": "MuiListItemText-dense",
+                                  "inset": "MuiListItemText-inset",
+                                  "multiline": "MuiListItemText-multiline",
+                                  "primary": "MuiListItemText-primary",
+                                  "root": "MuiListItemText-root",
+                                  "secondary": "MuiListItemText-secondary",
+                                }
+                              }
+                              primary="Title"
+                            >
+                              <div
+                                className="MuiListItemText-root"
+                              >
+                                <WithStyles(ForwardRef(Typography))
+                                  className="MuiListItemText-primary"
+                                  component="span"
+                                  variant="body1"
+                                >
+                                  <ForwardRef(Typography)
+                                    className="MuiListItemText-primary"
+                                    classes={
+                                      Object {
+                                        "alignCenter": "MuiTypography-alignCenter",
+                                        "alignJustify": "MuiTypography-alignJustify",
+                                        "alignLeft": "MuiTypography-alignLeft",
+                                        "alignRight": "MuiTypography-alignRight",
+                                        "body1": "MuiTypography-body1",
+                                        "body2": "MuiTypography-body2",
+                                        "button": "MuiTypography-button",
+                                        "caption": "MuiTypography-caption",
+                                        "colorError": "MuiTypography-colorError",
+                                        "colorInherit": "MuiTypography-colorInherit",
+                                        "colorPrimary": "MuiTypography-colorPrimary",
+                                        "colorSecondary": "MuiTypography-colorSecondary",
+                                        "colorTextPrimary": "MuiTypography-colorTextPrimary",
+                                        "colorTextSecondary": "MuiTypography-colorTextSecondary",
+                                        "displayBlock": "MuiTypography-displayBlock",
+                                        "displayInline": "MuiTypography-displayInline",
+                                        "gutterBottom": "MuiTypography-gutterBottom",
+                                        "h1": "MuiTypography-h1",
+                                        "h2": "MuiTypography-h2",
+                                        "h3": "MuiTypography-h3",
+                                        "h4": "MuiTypography-h4",
+                                        "h5": "MuiTypography-h5",
+                                        "h6": "MuiTypography-h6",
+                                        "noWrap": "MuiTypography-noWrap",
+                                        "overline": "MuiTypography-overline",
+                                        "paragraph": "MuiTypography-paragraph",
+                                        "root": "MuiTypography-root",
+                                        "srOnly": "MuiTypography-srOnly",
+                                        "subtitle1": "MuiTypography-subtitle1",
+                                        "subtitle2": "MuiTypography-subtitle2",
+                                      }
+                                    }
+                                    component="span"
+                                    theme={
+                                      Object {
+                                        "breakpoints": Object {
+                                          "between": [Function],
+                                          "down": [Function],
+                                          "keys": Array [
+                                            "xs",
+                                            "sm",
+                                            "md",
+                                            "lg",
+                                            "xl",
+                                          ],
+                                          "only": [Function],
+                                          "up": [Function],
+                                          "values": Object {
+                                            "lg": 1280,
+                                            "md": 960,
+                                            "sm": 600,
+                                            "xl": 1920,
+                                            "xs": 0,
+                                          },
+                                          "width": [Function],
+                                        },
+                                        "direction": "ltr",
+                                        "mixins": Object {
+                                          "gutters": [Function],
+                                          "toolbar": Object {
+                                            "@media (min-width:0px) and (orientation: landscape)": Object {
+                                              "minHeight": 48,
+                                            },
+                                            "@media (min-width:600px)": Object {
+                                              "minHeight": 64,
+                                            },
+                                            "minHeight": 56,
+                                          },
+                                        },
+                                        "overrides": Object {},
+                                        "palette": Object {
+                                          "action": Object {
+                                            "active": "rgba(0, 0, 0, 0.54)",
+                                            "disabled": "rgba(0, 0, 0, 0.26)",
+                                            "disabledBackground": "rgba(0, 0, 0, 0.12)",
+                                            "hover": "rgba(0, 0, 0, 0.08)",
+                                            "hoverOpacity": 0.08,
+                                            "selected": "rgba(0, 0, 0, 0.14)",
+                                          },
+                                          "augmentColor": [Function],
+                                          "background": Object {
+                                            "default": "#fafafa",
+                                            "paper": "#fff",
+                                          },
+                                          "common": Object {
+                                            "black": "#000",
+                                            "white": "#fff",
+                                          },
+                                          "contrastThreshold": 3,
+                                          "divider": "rgba(0, 0, 0, 0.12)",
+                                          "error": Object {
+                                            "contrastText": "#fff",
+                                            "dark": "#d32f2f",
+                                            "light": "#e57373",
+                                            "main": "#f44336",
+                                          },
+                                          "getContrastText": [Function],
+                                          "grey": Object {
+                                            "100": "#f5f5f5",
+                                            "200": "#eeeeee",
+                                            "300": "#e0e0e0",
+                                            "400": "#bdbdbd",
+                                            "50": "#fafafa",
+                                            "500": "#9e9e9e",
+                                            "600": "#757575",
+                                            "700": "#616161",
+                                            "800": "#424242",
+                                            "900": "#212121",
+                                            "A100": "#d5d5d5",
+                                            "A200": "#aaaaaa",
+                                            "A400": "#303030",
+                                            "A700": "#616161",
+                                          },
+                                          "primary": Object {
+                                            "contrastText": "#fff",
+                                            "dark": "#303f9f",
+                                            "light": "#7986cb",
+                                            "main": "#3f51b5",
+                                          },
+                                          "secondary": Object {
+                                            "contrastText": "#fff",
+                                            "dark": "#c51162",
+                                            "light": "#ff4081",
+                                            "main": "#f50057",
+                                          },
+                                          "text": Object {
+                                            "disabled": "rgba(0, 0, 0, 0.38)",
+                                            "hint": "rgba(0, 0, 0, 0.38)",
+                                            "primary": "rgba(0, 0, 0, 0.87)",
+                                            "secondary": "rgba(0, 0, 0, 0.54)",
+                                          },
+                                          "tonalOffset": 0.2,
+                                          "type": "light",
+                                        },
+                                        "props": Object {},
+                                        "shadows": Array [
+                                          "none",
+                                          "0px 1px 3px 0px rgba(0,0,0,0.2),0px 1px 1px 0px rgba(0,0,0,0.14),0px 2px 1px -1px rgba(0,0,0,0.12)",
+                                          "0px 1px 5px 0px rgba(0,0,0,0.2),0px 2px 2px 0px rgba(0,0,0,0.14),0px 3px 1px -2px rgba(0,0,0,0.12)",
+                                          "0px 1px 8px 0px rgba(0,0,0,0.2),0px 3px 4px 0px rgba(0,0,0,0.14),0px 3px 3px -2px rgba(0,0,0,0.12)",
+                                          "0px 2px 4px -1px rgba(0,0,0,0.2),0px 4px 5px 0px rgba(0,0,0,0.14),0px 1px 10px 0px rgba(0,0,0,0.12)",
+                                          "0px 3px 5px -1px rgba(0,0,0,0.2),0px 5px 8px 0px rgba(0,0,0,0.14),0px 1px 14px 0px rgba(0,0,0,0.12)",
+                                          "0px 3px 5px -1px rgba(0,0,0,0.2),0px 6px 10px 0px rgba(0,0,0,0.14),0px 1px 18px 0px rgba(0,0,0,0.12)",
+                                          "0px 4px 5px -2px rgba(0,0,0,0.2),0px 7px 10px 1px rgba(0,0,0,0.14),0px 2px 16px 1px rgba(0,0,0,0.12)",
+                                          "0px 5px 5px -3px rgba(0,0,0,0.2),0px 8px 10px 1px rgba(0,0,0,0.14),0px 3px 14px 2px rgba(0,0,0,0.12)",
+                                          "0px 5px 6px -3px rgba(0,0,0,0.2),0px 9px 12px 1px rgba(0,0,0,0.14),0px 3px 16px 2px rgba(0,0,0,0.12)",
+                                          "0px 6px 6px -3px rgba(0,0,0,0.2),0px 10px 14px 1px rgba(0,0,0,0.14),0px 4px 18px 3px rgba(0,0,0,0.12)",
+                                          "0px 6px 7px -4px rgba(0,0,0,0.2),0px 11px 15px 1px rgba(0,0,0,0.14),0px 4px 20px 3px rgba(0,0,0,0.12)",
+                                          "0px 7px 8px -4px rgba(0,0,0,0.2),0px 12px 17px 2px rgba(0,0,0,0.14),0px 5px 22px 4px rgba(0,0,0,0.12)",
+                                          "0px 7px 8px -4px rgba(0,0,0,0.2),0px 13px 19px 2px rgba(0,0,0,0.14),0px 5px 24px 4px rgba(0,0,0,0.12)",
+                                          "0px 7px 9px -4px rgba(0,0,0,0.2),0px 14px 21px 2px rgba(0,0,0,0.14),0px 5px 26px 4px rgba(0,0,0,0.12)",
+                                          "0px 8px 9px -5px rgba(0,0,0,0.2),0px 15px 22px 2px rgba(0,0,0,0.14),0px 6px 28px 5px rgba(0,0,0,0.12)",
+                                          "0px 8px 10px -5px rgba(0,0,0,0.2),0px 16px 24px 2px rgba(0,0,0,0.14),0px 6px 30px 5px rgba(0,0,0,0.12)",
+                                          "0px 8px 11px -5px rgba(0,0,0,0.2),0px 17px 26px 2px rgba(0,0,0,0.14),0px 6px 32px 5px rgba(0,0,0,0.12)",
+                                          "0px 9px 11px -5px rgba(0,0,0,0.2),0px 18px 28px 2px rgba(0,0,0,0.14),0px 7px 34px 6px rgba(0,0,0,0.12)",
+                                          "0px 9px 12px -6px rgba(0,0,0,0.2),0px 19px 29px 2px rgba(0,0,0,0.14),0px 7px 36px 6px rgba(0,0,0,0.12)",
+                                          "0px 10px 13px -6px rgba(0,0,0,0.2),0px 20px 31px 3px rgba(0,0,0,0.14),0px 8px 38px 7px rgba(0,0,0,0.12)",
+                                          "0px 10px 13px -6px rgba(0,0,0,0.2),0px 21px 33px 3px rgba(0,0,0,0.14),0px 8px 40px 7px rgba(0,0,0,0.12)",
+                                          "0px 10px 14px -6px rgba(0,0,0,0.2),0px 22px 35px 3px rgba(0,0,0,0.14),0px 8px 42px 7px rgba(0,0,0,0.12)",
+                                          "0px 11px 14px -7px rgba(0,0,0,0.2),0px 23px 36px 3px rgba(0,0,0,0.14),0px 9px 44px 8px rgba(0,0,0,0.12)",
+                                          "0px 11px 15px -7px rgba(0,0,0,0.2),0px 24px 38px 3px rgba(0,0,0,0.14),0px 9px 46px 8px rgba(0,0,0,0.12)",
+                                        ],
+                                        "shape": Object {
+                                          "borderRadius": 4,
+                                        },
+                                        "spacing": [Function],
+                                        "transitions": Object {
+                                          "create": [Function],
+                                          "duration": Object {
+                                            "complex": 375,
+                                            "enteringScreen": 225,
+                                            "leavingScreen": 195,
+                                            "short": 250,
+                                            "shorter": 200,
+                                            "shortest": 150,
+                                            "standard": 300,
+                                          },
+                                          "easing": Object {
+                                            "easeIn": "cubic-bezier(0.4, 0, 1, 1)",
+                                            "easeInOut": "cubic-bezier(0.4, 0, 0.2, 1)",
+                                            "easeOut": "cubic-bezier(0.0, 0, 0.2, 1)",
+                                            "sharp": "cubic-bezier(0.4, 0, 0.6, 1)",
+                                          },
+                                          "getAutoHeightDuration": [Function],
+                                        },
+                                        "typography": Object {
+                                          "body1": Object {
+                                            "fontFamily": "\\"Roboto\\", \\"Helvetica\\", \\"Arial\\", sans-serif",
+                                            "fontSize": "1rem",
+                                            "fontWeight": 400,
+                                            "letterSpacing": "0.00938em",
+                                            "lineHeight": 1.5,
+                                          },
+                                          "body2": Object {
+                                            "fontFamily": "\\"Roboto\\", \\"Helvetica\\", \\"Arial\\", sans-serif",
+                                            "fontSize": "0.875rem",
+                                            "fontWeight": 400,
+                                            "letterSpacing": "0.01071em",
+                                            "lineHeight": 1.43,
+                                          },
+                                          "button": Object {
+                                            "fontFamily": "\\"Roboto\\", \\"Helvetica\\", \\"Arial\\", sans-serif",
+                                            "fontSize": "0.875rem",
+                                            "fontWeight": 500,
+                                            "letterSpacing": "0.02857em",
+                                            "lineHeight": 1.75,
+                                            "textTransform": "uppercase",
+                                          },
+                                          "caption": Object {
+                                            "fontFamily": "\\"Roboto\\", \\"Helvetica\\", \\"Arial\\", sans-serif",
+                                            "fontSize": "0.75rem",
+                                            "fontWeight": 400,
+                                            "letterSpacing": "0.03333em",
+                                            "lineHeight": 1.66,
+                                          },
+                                          "fontFamily": "\\"Roboto\\", \\"Helvetica\\", \\"Arial\\", sans-serif",
+                                          "fontSize": 14,
+                                          "fontWeightBold": 700,
+                                          "fontWeightLight": 300,
+                                          "fontWeightMedium": 500,
+                                          "fontWeightRegular": 400,
+                                          "h1": Object {
+                                            "fontFamily": "\\"Roboto\\", \\"Helvetica\\", \\"Arial\\", sans-serif",
+                                            "fontSize": "6rem",
+                                            "fontWeight": 300,
+                                            "letterSpacing": "-0.01562em",
+                                            "lineHeight": 1,
+                                          },
+                                          "h2": Object {
+                                            "fontFamily": "\\"Roboto\\", \\"Helvetica\\", \\"Arial\\", sans-serif",
+                                            "fontSize": "3.75rem",
+                                            "fontWeight": 300,
+                                            "letterSpacing": "-0.00833em",
+                                            "lineHeight": 1,
+                                          },
+                                          "h3": Object {
+                                            "fontFamily": "\\"Roboto\\", \\"Helvetica\\", \\"Arial\\", sans-serif",
+                                            "fontSize": "3rem",
+                                            "fontWeight": 400,
+                                            "letterSpacing": "0em",
+                                            "lineHeight": 1.04,
+                                          },
+                                          "h4": Object {
+                                            "fontFamily": "\\"Roboto\\", \\"Helvetica\\", \\"Arial\\", sans-serif",
+                                            "fontSize": "2.125rem",
+                                            "fontWeight": 400,
+                                            "letterSpacing": "0.00735em",
+                                            "lineHeight": 1.17,
+                                          },
+                                          "h5": Object {
+                                            "fontFamily": "\\"Roboto\\", \\"Helvetica\\", \\"Arial\\", sans-serif",
+                                            "fontSize": "1.5rem",
+                                            "fontWeight": 400,
+                                            "letterSpacing": "0em",
+                                            "lineHeight": 1.33,
+                                          },
+                                          "h6": Object {
+                                            "fontFamily": "\\"Roboto\\", \\"Helvetica\\", \\"Arial\\", sans-serif",
+                                            "fontSize": "1.25rem",
+                                            "fontWeight": 500,
+                                            "letterSpacing": "0.0075em",
+                                            "lineHeight": 1.6,
+                                          },
+                                          "htmlFontSize": 16,
+                                          "overline": Object {
+                                            "fontFamily": "\\"Roboto\\", \\"Helvetica\\", \\"Arial\\", sans-serif",
+                                            "fontSize": "0.75rem",
+                                            "fontWeight": 400,
+                                            "letterSpacing": "0.08333em",
+                                            "lineHeight": 2.66,
+                                            "textTransform": "uppercase",
+                                          },
+                                          "pxToRem": [Function],
+                                          "round": [Function],
+                                          "subtitle1": Object {
+                                            "fontFamily": "\\"Roboto\\", \\"Helvetica\\", \\"Arial\\", sans-serif",
+                                            "fontSize": "1rem",
+                                            "fontWeight": 400,
+                                            "letterSpacing": "0.00938em",
+                                            "lineHeight": 1.75,
+                                          },
+                                          "subtitle2": Object {
+                                            "fontFamily": "\\"Roboto\\", \\"Helvetica\\", \\"Arial\\", sans-serif",
+                                            "fontSize": "0.875rem",
+                                            "fontWeight": 500,
+                                            "letterSpacing": "0.00714em",
+                                            "lineHeight": 1.57,
+                                          },
+                                        },
+                                        "zIndex": Object {
+                                          "appBar": 1100,
+                                          "drawer": 1200,
+                                          "mobileStepper": 1000,
+                                          "modal": 1300,
+                                          "snackbar": 1400,
+                                          "tooltip": 1500,
+                                        },
+                                      }
+                                    }
+                                    variant="body1"
+                                  >
+                                    <span
+                                      className="MuiTypography-root MuiListItemText-primary MuiTypography-body1"
+                                    >
+                                      Title
+                                    </span>
+                                  </ForwardRef(Typography)>
+                                </WithStyles(ForwardRef(Typography))>
+                              </div>
+                            </ForwardRef(ListItemText)>
+                          </WithStyles(ForwardRef(ListItemText))>
+                          <NoSsr>
+                            <WithStyles(TouchRipple)
+                              center={false}
+                            >
+                              <TouchRipple
+                                center={false}
+                                classes={
+                                  Object {
+                                    "child": "MuiTouchRipple-child",
+                                    "childLeaving": "MuiTouchRipple-childLeaving",
+                                    "childPulsate": "MuiTouchRipple-childPulsate",
+                                    "ripple": "MuiTouchRipple-ripple",
+                                    "ripplePulsate": "MuiTouchRipple-ripplePulsate",
+                                    "rippleVisible": "MuiTouchRipple-rippleVisible",
+                                    "root": "MuiTouchRipple-root",
+                                  }
+                                }
+                              >
+                                <span
+                                  className="MuiTouchRipple-root"
+                                >
+                                  <TransitionGroup
+                                    childFactory={[Function]}
+                                    component={null}
+                                    enter={true}
+                                    exit={true}
+                                  />
+                                </span>
+                              </TouchRipple>
+                            </WithStyles(TouchRipple)>
+                          </NoSsr>
+                        </div>
+                      </ForwardRef(ButtonBase)>
+                    </WithStyles(ForwardRef(ButtonBase))>
+                  </ForwardRef(ListItem)>
+                </WithStyles(ForwardRef(ListItem))>
+              </MenuItem>
+            </WithStyles(MenuItem)>
+          </ul>
+        </ForwardRef(List)>
+      </WithStyles(ForwardRef(List))>
     </div>
-  </ul>
-</div>
+  </Menu>
+</WithStyles(Menu)>
 `;
diff --git a/src/Menu/__snapshots__/MenuItem.test.jsx.snap b/src/Menu/__snapshots__/MenuItem.test.jsx.snap
index f038867..4758330 100644
--- a/src/Menu/__snapshots__/MenuItem.test.jsx.snap
+++ b/src/Menu/__snapshots__/MenuItem.test.jsx.snap
@@ -1,119 +1,57 @@
 // Jest Snapshot v1, https://goo.gl/fbAQLP
 
 exports[`renders correctly 1`] = `
-<div
-  className="MuiButtonBase-root-14 MuiListItem-root-2 MuiListItem-default-5 MuiListItem-gutters-10 MuiListItem-button-11"
-  onBlur={[Function]}
-  onClick={[Function]}
-  onContextMenu={[Function]}
-  onFocus={[Function]}
-  onKeyDown={[Function]}
-  onKeyUp={[Function]}
-  onMouseDown={[Function]}
-  onMouseLeave={[Function]}
-  onMouseUp={[Function]}
-  onTouchEnd={[Function]}
-  onTouchMove={[Function]}
-  onTouchStart={[Function]}
-  role="button"
-  tabIndex="0"
->
-  <div
-    className="MuiListItemText-root-17"
-  >
-    <span
-      className="MuiTypography-root-23 MuiTypography-subheading-30 MuiListItemText-primary-20"
-    >
-      Title
-    </span>
-  </div>
-  <span
-    className="MuiTouchRipple-root-59"
-  />
-</div>
+<MenuItem
+  classes={
+    Object {
+      "isDisabled": "MenuItem-isDisabled-1",
+    }
+  }
+  icon={null}
+  isDisabled={false}
+  redirectTo={[Function]}
+  title="Title"
+  url="/"
+/>
 `;
 
 exports[`renders correctly disabled 1`] = `
-<div
-  className="MuiButtonBase-root-14 MuiListItem-root-2 MuiListItem-default-5 MuiListItem-gutters-10 MuiListItem-button-11 MenuItem-isDisabled-1"
-  onBlur={[Function]}
-  onClick={[Function]}
-  onContextMenu={[Function]}
-  onFocus={[Function]}
-  onKeyDown={[Function]}
-  onKeyUp={[Function]}
-  onMouseDown={[Function]}
-  onMouseLeave={[Function]}
-  onMouseUp={[Function]}
-  onTouchEnd={[Function]}
-  onTouchMove={[Function]}
-  onTouchStart={[Function]}
-  role="button"
-  tabIndex="0"
->
-  <div
-    className="MuiListItemText-root-17"
-  >
-    <span
-      className="MuiTypography-root-23 MuiTypography-subheading-30 MuiListItemText-primary-20"
-    >
-      Title
-    </span>
-  </div>
-  <span
-    className="MuiTouchRipple-root-59"
-  />
-</div>
+<MenuItem
+  classes={
+    Object {
+      "isDisabled": "MenuItem-isDisabled-1",
+    }
+  }
+  icon={null}
+  isDisabled={true}
+  redirectTo={[Function]}
+  title="Title"
+  url="/"
+/>
 `;
 
 exports[`renders correctly with icon 1`] = `
-<div
-  className="MuiButtonBase-root-14 MuiListItem-root-2 MuiListItem-default-5 MuiListItem-gutters-10 MuiListItem-button-11"
-  onBlur={[Function]}
-  onClick={[Function]}
-  onContextMenu={[Function]}
-  onFocus={[Function]}
-  onKeyDown={[Function]}
-  onKeyUp={[Function]}
-  onMouseDown={[Function]}
-  onMouseLeave={[Function]}
-  onMouseUp={[Function]}
-  onTouchEnd={[Function]}
-  onTouchMove={[Function]}
-  onTouchStart={[Function]}
-  role="button"
-  tabIndex="0"
->
-  <div
-    className="MuiListItemIcon-root-66"
-  >
-    <svg
-      aria-hidden="true"
-      className="MuiSvgIcon-root-67"
-      focusable="false"
-      role="presentation"
-      viewBox="0 0 24 24"
-    >
-      <path
-        d="M0 0h24v24H0z"
-        fill="none"
-      />
-      <path
-        d="M22 5.72l-4.6-3.86-1.29 1.53 4.6 3.86L22 5.72zM7.88 3.39L6.6 1.86 2 5.71l1.29 1.53 4.59-3.85zM12.5 8H11v6l4.75 2.85.75-1.23-4-2.37V8zM12 4c-4.97 0-9 4.03-9 9s4.02 9 9 9c4.97 0 9-4.03 9-9s-4.03-9-9-9zm0 16c-3.87 0-7-3.13-7-7s3.13-7 7-7 7 3.13 7 7-3.13 7-7 7z"
-      />
-    </svg>
-  </div>
-  <div
-    className="MuiListItemText-root-17"
-  >
-    <span
-      className="MuiTypography-root-23 MuiTypography-subheading-30 MuiListItemText-primary-20"
-    >
-      Title
-    </span>
-  </div>
-  <span
-    className="MuiTouchRipple-root-59"
-  />
-</div>
+<MenuItem
+  classes={
+    Object {
+      "isDisabled": "MenuItem-isDisabled-1",
+    }
+  }
+  icon={
+    Object {
+      "$$typeof": Symbol(react.memo),
+      "compare": null,
+      "displayName": "AccessAlarmIcon",
+      "muiName": "SvgIcon",
+      "type": Object {
+        "$$typeof": Symbol(react.forward_ref),
+        "render": [Function],
+      },
+    }
+  }
+  isDisabled={false}
+  redirectTo={[Function]}
+  title="Title"
+  url="/"
+/>
 `;
diff --git a/src/NoMatch/NoMatch.test.jsx b/src/NoMatch/NoMatch.test.jsx
index 7d06b38..b062ee6 100644
--- a/src/NoMatch/NoMatch.test.jsx
+++ b/src/NoMatch/NoMatch.test.jsx
@@ -1,11 +1,11 @@
 import React from 'react'
 import { BrowserRouter as Router } from 'react-router-dom'
-import { mount } from 'enzyme'
+import { shallow } from 'enzyme'
 
-import NoMatch from './'
+import NoMatch from '.'
 
 it('renders correctly', () => {
-  const tree = mount((
+  const tree = shallow((
     <Router>
       <NoMatch
         title="Title"
@@ -17,7 +17,7 @@ it('renders correctly', () => {
 })
 
 it('renders correctly with description', () => {
-  const tree = mount(<NoMatch
+  const tree = shallow(<NoMatch
     title="Title"
     description={(
       <p>Desc</p>
diff --git a/src/NoMatch/__snapshots__/NoMatch.test.jsx.snap b/src/NoMatch/__snapshots__/NoMatch.test.jsx.snap
index 1e0cf41..2f33826 100644
--- a/src/NoMatch/__snapshots__/NoMatch.test.jsx.snap
+++ b/src/NoMatch/__snapshots__/NoMatch.test.jsx.snap
@@ -1,48 +1,46 @@
 // Jest Snapshot v1, https://goo.gl/fbAQLP
 
 exports[`renders correctly 1`] = `
-<div
-  className="NoMatch-root-1"
+<Router
+  history={
+    Object {
+      "action": "POP",
+      "block": [Function],
+      "createHref": [Function],
+      "go": [Function],
+      "goBack": [Function],
+      "goForward": [Function],
+      "length": 1,
+      "listen": [Function],
+      "location": Object {
+        "hash": "",
+        "pathname": "/",
+        "search": "",
+        "state": undefined,
+      },
+      "push": [Function],
+      "replace": [Function],
+    }
+  }
 >
-  <div>
-    <h2
-      className="MuiTypography-root-2 MuiTypography-h2-15"
-    >
-      Title
-    </h2>
-    <p
-      className="MuiTypography-root-2 MuiTypography-h4-17 MuiTypography-paragraph-30"
-    >
-      This URL does not exist, sorry. Please start over from the 
-      <a
-        href="/"
-        onClick={[Function]}
-      >
-        Dashboard
-      </a>
-      .
-    </p>
-  </div>
-</div>
+  <WithStyles(NoMatch)
+    title="Title"
+  />
+</Router>
 `;
 
 exports[`renders correctly with description 1`] = `
-<div
-  className="NoMatch-root-1"
->
-  <div>
-    <h2
-      className="MuiTypography-root-2 MuiTypography-h2-15"
-    >
-      Title
-    </h2>
-    <p
-      className="MuiTypography-root-2 MuiTypography-h4-17 MuiTypography-paragraph-30"
-    >
-      <p>
-        Desc
-      </p>
+<NoMatch
+  classes={
+    Object {
+      "root": "NoMatch-root-1",
+    }
+  }
+  description={
+    <p>
+      Desc
     </p>
-  </div>
-</div>
+  }
+  title="Title"
+/>
 `;
diff --git a/src/Snackbar/Snackbar.test.jsx b/src/Snackbar/Snackbar.test.jsx
index cca823b..389a7fe 100644
--- a/src/Snackbar/Snackbar.test.jsx
+++ b/src/Snackbar/Snackbar.test.jsx
@@ -1,10 +1,10 @@
 import React from 'react'
-import { mount } from 'enzyme'
+import { shallow } from 'enzyme'
 
 import Snackbar from '.'
 
 it('renders correctly', () => {
-  const tree = mount(<Snackbar message="Message" />)
+  const tree = shallow(<Snackbar message="Message" />)
 
   expect(tree).toMatchSnapshot()
 })
diff --git a/src/Snackbar/__snapshots__/Snackbar.test.jsx.snap b/src/Snackbar/__snapshots__/Snackbar.test.jsx.snap
index 0cdaf28..e769f10 100644
--- a/src/Snackbar/__snapshots__/Snackbar.test.jsx.snap
+++ b/src/Snackbar/__snapshots__/Snackbar.test.jsx.snap
@@ -1,3 +1,26 @@
 // Jest Snapshot v1, https://goo.gl/fbAQLP
 
-exports[`renders correctly 1`] = `""`;
+exports[`renders correctly 1`] = `
+<WithStyles(ForwardRef(Snackbar))
+  SnackbarContentProps={
+    Object {
+      "aria-describedby": "message-id",
+    }
+  }
+  anchorOrigin={
+    Object {
+      "horizontal": "left",
+      "vertical": "bottom",
+    }
+  }
+  autoHideDuration={6000}
+  message={
+    <span
+      id="message-id"
+    >
+      Message
+    </span>
+  }
+  open={false}
+/>
+`;
diff --git a/src/Tabs/Tabs.test.jsx b/src/Tabs/Tabs.test.jsx
index 114d591..d03d093 100644
--- a/src/Tabs/Tabs.test.jsx
+++ b/src/Tabs/Tabs.test.jsx
@@ -1,17 +1,17 @@
 import React from 'react'
 import MockRouter from 'react-mock-router'
-import Enzyme, { mount } from 'enzyme'
+import Enzyme, { shallow } from 'enzyme'
 import Adapter from 'enzyme-adapter-react-16'
 import { Tab } from '@material-ui/core'
 
 import Tabs from '.'
-import tabsContent from '../__tests__/data/tabs'
+import tabsContent from '../tests/data/tabs'
 
 Enzyme.configure({ adapter: new Adapter() })
 
 describe('Tabs', () => {
   it('renders correctly', () => {
-    const tree = mount((
+    const tree = shallow((
       <MockRouter>
         <Tabs
           data={[{
@@ -28,7 +28,7 @@ describe('Tabs', () => {
   })
 
   it('renders correctly if no data', () => {
-    const tree = mount((
+    const tree = shallow((
       <MockRouter>
         <Tabs data={[]} />
       </MockRouter>
@@ -39,7 +39,7 @@ describe('Tabs', () => {
 
   it('click second tab', () => {
     const tabAt = 1
-    const tabs = mount(<MockRouter><Tabs data={tabsContent} /></MockRouter>)
+    const tabs = shallow(<MockRouter><Tabs data={tabsContent} /></MockRouter>)
 
     expect(window.location.hash).toBe('')
     tabs.find(Tab).at(tabAt).simulate('click')
@@ -50,7 +50,7 @@ describe('Tabs', () => {
     const tabAt = 1
     window.location.hash = `#/${tabsContent[tabAt].id}`
 
-    mount(<MockRouter><Tabs data={tabsContent} /></MockRouter>)
+    shallow(<MockRouter><Tabs data={tabsContent} /></MockRouter>)
 
     expect(window.location.hash).toBe(`#/${tabsContent[tabAt].id}`)
   })
diff --git a/src/Tabs/__snapshots__/Tabs.test.jsx.snap b/src/Tabs/__snapshots__/Tabs.test.jsx.snap
index e14f1ab..9e0ff8c 100644
--- a/src/Tabs/__snapshots__/Tabs.test.jsx.snap
+++ b/src/Tabs/__snapshots__/Tabs.test.jsx.snap
@@ -1,134 +1,22 @@
 // Jest Snapshot v1, https://goo.gl/fbAQLP
 
 exports[`Tabs renders correctly 1`] = `
-<div
-  className="Tabs-root-1"
->
-  <header
-    className="MuiPaper-root-10 MuiPaper-elevation4-16 MuiAppBar-root-2 MuiAppBar-positionStatic-6 MuiAppBar-colorPrimary-8"
-  >
-    <div
-      className="MuiTabs-root-37"
-    >
-      <div
-        className="MuiTabs-flexContainer-38"
-      >
-        <div
-          className="MuiTabs-scroller-40 MuiTabs-fixed-41"
-          onScroll={[Function]}
-          role="tablist"
-          style={
-            Object {
-              "marginBottom": 0,
-            }
-          }
-        >
-          <div
-            className="MuiTabs-flexContainer-38"
-          >
-            <button
-              aria-selected={true}
-              className="MuiButtonBase-root-58 MuiTab-root-46 MuiTab-textColorInherit-48 MuiTab-selected-51"
-              disabled={false}
-              onBlur={[Function]}
-              onClick={[Function]}
-              onFocus={[Function]}
-              onKeyDown={[Function]}
-              onKeyUp={[Function]}
-              onMouseDown={[Function]}
-              onMouseLeave={[Function]}
-              onMouseUp={[Function]}
-              onTouchEnd={[Function]}
-              onTouchMove={[Function]}
-              onTouchStart={[Function]}
-              role="tab"
-              tabIndex="0"
-              type="button"
-            >
-              <span
-                className="MuiTab-wrapper-54"
-              >
-                <span
-                  className="MuiTab-labelContainer-55"
-                >
-                  <span
-                    className="MuiTab-label-56"
-                  >
-                    Title
-                  </span>
-                </span>
-              </span>
-              <span
-                className="MuiTouchRipple-root-64"
-              />
-            </button>
-          </div>
-          <span
-            className="TabIndicator-root-61 TabIndicator-colorSecondary-63 MuiTabs-indicator-45"
-            style={
-              Object {
-                "left": 0,
-                "width": 0,
-              }
-            }
-          />
-        </div>
-      </div>
-    </div>
-  </header>
-  <div
-    className="MuiTypography-root-71 MuiTypography-body1-80"
-    style={
+<withRouter(WithStyles(Tabs))
+  data={
+    Array [
       Object {
-        "padding": 24,
-      }
-    }
-  >
-    <p>
-      Content
-    </p>
-  </div>
-</div>
+        "content": <p>
+          Content
+        </p>,
+        "title": "Title",
+      },
+    ]
+  }
+/>
 `;
 
 exports[`Tabs renders correctly if no data 1`] = `
-<div
-  className="Tabs-root-1"
->
-  <header
-    className="MuiPaper-root-10 MuiPaper-elevation4-16 MuiAppBar-root-2 MuiAppBar-positionStatic-6 MuiAppBar-colorPrimary-8"
-  >
-    <div
-      className="MuiTabs-root-37"
-    >
-      <div
-        className="MuiTabs-flexContainer-38"
-      >
-        <div
-          className="MuiTabs-scroller-40 MuiTabs-fixed-41"
-          onScroll={[Function]}
-          role="tablist"
-          style={
-            Object {
-              "marginBottom": 0,
-            }
-          }
-        >
-          <div
-            className="MuiTabs-flexContainer-38"
-          />
-          <span
-            className="TabIndicator-root-61 TabIndicator-colorSecondary-63 MuiTabs-indicator-45"
-            style={
-              Object {
-                "left": 0,
-                "width": 0,
-              }
-            }
-          />
-        </div>
-      </div>
-    </div>
-  </header>
-</div>
+<withRouter(WithStyles(Tabs))
+  data={Array []}
+/>
 `;
diff --git a/index.d.ts b/src/index.d.ts
similarity index 100%
rename from index.d.ts
rename to src/index.d.ts
diff --git a/src/index.jsx b/src/index.jsx
index 5fd28b8..d53f57e 100644
--- a/src/index.jsx
+++ b/src/index.jsx
@@ -1,7 +1,7 @@
 import React from 'react'
 import ReactDOM from 'react-dom'
 
-import Container from './__tests__/Container'
+import Container from './tests/Container'
 
 const element = document.querySelector('[data-react-app]')
 
diff --git a/src/setupTests.js b/src/setupTests.js
new file mode 100644
index 0000000..3f50050
--- /dev/null
+++ b/src/setupTests.js
@@ -0,0 +1,8 @@
+/* eslint-disable import/no-extraneous-dependencies */
+import { configure } from 'enzyme'
+import Adapter from 'enzyme-adapter-react-16'
+import 'jest-enzyme'
+
+configure({
+  adapter: new Adapter(),
+})
diff --git a/src/__tests__/Container.jsx b/src/tests/Container.jsx
similarity index 100%
rename from src/__tests__/Container.jsx
rename to src/tests/Container.jsx
diff --git a/src/__tests__/General.jsx b/src/tests/General.jsx
similarity index 100%
rename from src/__tests__/General.jsx
rename to src/tests/General.jsx
diff --git a/src/__tests__/Page.jsx b/src/tests/Page.jsx
similarity index 100%
rename from src/__tests__/Page.jsx
rename to src/tests/Page.jsx
diff --git a/src/__tests__/data/dashboard.js b/src/tests/data/dashboard.js
similarity index 100%
rename from src/__tests__/data/dashboard.js
rename to src/tests/data/dashboard.js
diff --git a/src/__tests__/data/form.jsx b/src/tests/data/form.jsx
similarity index 100%
rename from src/__tests__/data/form.jsx
rename to src/tests/data/form.jsx
diff --git a/src/__tests__/data/listing_data.js b/src/tests/data/listing_data.js
similarity index 100%
rename from src/__tests__/data/listing_data.js
rename to src/tests/data/listing_data.js
diff --git a/src/__tests__/data/listing_headers.jsx b/src/tests/data/listing_headers.jsx
similarity index 100%
rename from src/__tests__/data/listing_headers.jsx
rename to src/tests/data/listing_headers.jsx
diff --git a/src/__tests__/data/menu.js b/src/tests/data/menu.js
similarity index 100%
rename from src/__tests__/data/menu.js
rename to src/tests/data/menu.js
diff --git a/src/__tests__/data/tabs.jsx b/src/tests/data/tabs.jsx
similarity index 100%
rename from src/__tests__/data/tabs.jsx
rename to src/tests/data/tabs.jsx
diff --git a/yarn.lock b/yarn.lock
index ec1f456..2c9f1dc 100644
--- a/yarn.lock
+++ b/yarn.lock
@@ -1036,6 +1036,16 @@
     "@jest/types" "^24.7.0"
     jest-mock "^24.7.0"
 
+"@jest/environment@^24.8.0":
+  version "24.8.0"
+  resolved "https://registry.yarnpkg.com/@jest/environment/-/environment-24.8.0.tgz#0342261383c776bdd652168f68065ef144af0eac"
+  integrity sha512-vlGt2HLg7qM+vtBrSkjDxk9K0YtRBi7HfRFaDxoRtyi+DyVChzhF20duvpdAnKVBV6W5tym8jm0U9EfXbDk1tw==
+  dependencies:
+    "@jest/fake-timers" "^24.8.0"
+    "@jest/transform" "^24.8.0"
+    "@jest/types" "^24.8.0"
+    jest-mock "^24.8.0"
+
 "@jest/fake-timers@^24.7.1":
   version "24.7.1"
   resolved "https://registry.yarnpkg.com/@jest/fake-timers/-/fake-timers-24.7.1.tgz#56e5d09bdec09ee81050eaff2794b26c71d19db2"
@@ -2763,6 +2773,11 @@ cipher-base@^1.0.0, cipher-base@^1.0.1, cipher-base@^1.0.3:
     inherits "^2.0.1"
     safe-buffer "^5.0.1"
 
+circular-json-es6@^2.0.1:
+  version "2.0.2"
+  resolved "https://registry.yarnpkg.com/circular-json-es6/-/circular-json-es6-2.0.2.tgz#e4f4a093e49fb4b6aba1157365746112a78bd344"
+  integrity sha512-ODYONMMNb3p658Zv+Pp+/XPa5s6q7afhz3Tzyvo+VRh9WIrJ64J76ZC4GQxnlye/NesTn09jvOiuE8+xxfpwhQ==
+
 class-utils@^0.3.5:
   version "0.3.6"
   resolved "https://registry.yarnpkg.com/class-utils/-/class-utils-0.3.6.tgz#f93369ae8b9a7ce02fd41faad0ca83033190c463"
@@ -3524,6 +3539,13 @@ decode-uri-component@^0.2.0:
   resolved "https://registry.yarnpkg.com/decode-uri-component/-/decode-uri-component-0.2.0.tgz#eb3913333458775cb84cd1a1fae062106bb87545"
   integrity sha1-6zkTMzRYd1y4TNGh+uBiEGu4dUU=
 
+deep-equal-ident@^1.1.1:
+  version "1.1.1"
+  resolved "https://registry.yarnpkg.com/deep-equal-ident/-/deep-equal-ident-1.1.1.tgz#06f4b89e53710cd6cea4a7781c7a956642de8dc9"
+  integrity sha1-BvS4nlNxDNbOpKd4HHqVZkLejck=
+  dependencies:
+    lodash.isequal "^3.0"
+
 deep-equal@^1.0.1:
   version "1.0.1"
   resolved "https://registry.yarnpkg.com/deep-equal/-/deep-equal-1.0.1.tgz#f5d260292b660e084eff4cdbc9f08ad3247448b5"
@@ -3919,7 +3941,15 @@ enzyme-adapter-utils@^1.12.0:
     prop-types "^15.7.2"
     semver "^5.6.0"
 
-enzyme-to-json@^3.3.5:
+enzyme-matchers@^7.0.2:
+  version "7.0.2"
+  resolved "https://registry.yarnpkg.com/enzyme-matchers/-/enzyme-matchers-7.0.2.tgz#fe47f2cb54f8b0c5a3f0e515faf8131c188f613a"
+  integrity sha512-hsWb4Mw+F0eJ9q6ljTK2RqLwsrdoKfr5IXmKtDaTPeOEFXsVl6L2RX2REdevvn2KJfSxkcKaCGwPldOSc1l9tQ==
+  dependencies:
+    circular-json-es6 "^2.0.1"
+    deep-equal-ident "^1.1.1"
+
+enzyme-to-json@^3.3.0, enzyme-to-json@^3.3.5:
   version "3.3.5"
   resolved "https://registry.yarnpkg.com/enzyme-to-json/-/enzyme-to-json-3.3.5.tgz#f8eb82bd3d5941c9d8bc6fd9140030777d17d0af"
   integrity sha512-DmH1wJ68HyPqKSYXdQqB33ZotwfUhwQZW3IGXaNXgR69Iodaoj8TF/D9RjLdz4pEhGq2Tx2zwNUIjBuqoZeTgA==
@@ -6061,6 +6091,13 @@ jest-each@^24.7.1:
     jest-util "^24.7.1"
     pretty-format "^24.7.0"
 
+jest-environment-enzyme@^7.0.2:
+  version "7.0.2"
+  resolved "https://registry.yarnpkg.com/jest-environment-enzyme/-/jest-environment-enzyme-7.0.2.tgz#7af83556e9a894d350d0dd4e561eaa33254e1daf"
+  integrity sha512-cBBWX3ZCR4JJR6ml6cTYLH1fdBZ2QEbywY6yrkgTP6OZgE+Nh6Agu0g99uJha2F36+zRFS/xkk8AIEAJvLtzQQ==
+  dependencies:
+    jest-environment-jsdom "^24.0.0"
+
 jest-environment-jsdom-fourteen@0.1.0:
   version "0.1.0"
   resolved "https://registry.yarnpkg.com/jest-environment-jsdom-fourteen/-/jest-environment-jsdom-fourteen-0.1.0.tgz#aad6393a9d4b565b69a609109bf469f62bf18ccc"
@@ -6070,6 +6107,18 @@ jest-environment-jsdom-fourteen@0.1.0:
     jest-util "^24.5.0"
     jsdom "^14.0.0"
 
+jest-environment-jsdom@^24.0.0:
+  version "24.8.0"
+  resolved "https://registry.yarnpkg.com/jest-environment-jsdom/-/jest-environment-jsdom-24.8.0.tgz#300f6949a146cabe1c9357ad9e9ecf9f43f38857"
+  integrity sha512-qbvgLmR7PpwjoFjM/sbuqHJt/NCkviuq9vus9NBn/76hhSidO+Z6Bn9tU8friecegbJL8gzZQEMZBQlFWDCwAQ==
+  dependencies:
+    "@jest/environment" "^24.8.0"
+    "@jest/fake-timers" "^24.8.0"
+    "@jest/types" "^24.8.0"
+    jest-mock "^24.8.0"
+    jest-util "^24.8.0"
+    jsdom "^11.5.1"
+
 jest-environment-jsdom@^24.7.1:
   version "24.7.1"
   resolved "https://registry.yarnpkg.com/jest-environment-jsdom/-/jest-environment-jsdom-24.7.1.tgz#a40e004b4458ebeb8a98082df135fd501b9fbbd6"
@@ -6093,6 +6142,15 @@ jest-environment-node@^24.7.1:
     jest-mock "^24.7.0"
     jest-util "^24.7.1"
 
+jest-enzyme@^7.0.2:
+  version "7.0.2"
+  resolved "https://registry.yarnpkg.com/jest-enzyme/-/jest-enzyme-7.0.2.tgz#706af4d713846d5cb78c24830cf3deed9bb029a1"
+  integrity sha512-7N9YhFmyPkDcVyvifyWePkJaZQX/wON4D6uD8qmGSc2ZaXjj+fkEPMaZ1+Kqnp75FTHaJZ+NVigpmoQiys+J2w==
+  dependencies:
+    enzyme-matchers "^7.0.2"
+    enzyme-to-json "^3.3.0"
+    jest-environment-enzyme "^7.0.2"
+
 jest-get-type@^24.3.0:
   version "24.3.0"
   resolved "https://registry.yarnpkg.com/jest-get-type/-/jest-get-type-24.3.0.tgz#582cfd1a4f91b5cdad1d43d2932f816d543c65da"
@@ -6913,6 +6971,25 @@ locate-path@^3.0.0:
     p-locate "^3.0.0"
     path-exists "^3.0.0"
 
+lodash._baseisequal@^3.0.0:
+  version "3.0.7"
+  resolved "https://registry.yarnpkg.com/lodash._baseisequal/-/lodash._baseisequal-3.0.7.tgz#d8025f76339d29342767dcc887ce5cb95a5b51f1"
+  integrity sha1-2AJfdjOdKTQnZ9zIh85cuVpbUfE=
+  dependencies:
+    lodash.isarray "^3.0.0"
+    lodash.istypedarray "^3.0.0"
+    lodash.keys "^3.0.0"
+
+lodash._bindcallback@^3.0.0:
+  version "3.0.1"
+  resolved "https://registry.yarnpkg.com/lodash._bindcallback/-/lodash._bindcallback-3.0.1.tgz#e531c27644cf8b57a99e17ed95b35c748789392e"
+  integrity sha1-5THCdkTPi1epnhftlbNcdIeJOS4=
+
+lodash._getnative@^3.0.0:
+  version "3.9.1"
+  resolved "https://registry.yarnpkg.com/lodash._getnative/-/lodash._getnative-3.9.1.tgz#570bc7dede46d61cdcde687d65d3eecbaa3aaff5"
+  integrity sha1-VwvH3t5G1hzc3mh9ZdPuy6o6r/U=
+
 lodash._reinterpolate@~3.0.0:
   version "3.0.0"
   resolved "https://registry.yarnpkg.com/lodash._reinterpolate/-/lodash._reinterpolate-3.0.0.tgz#0ccf2d89166af03b3663c796538b75ac6e114d9d"
@@ -6928,11 +7005,43 @@ lodash.flattendeep@^4.4.0:
   resolved "https://registry.yarnpkg.com/lodash.flattendeep/-/lodash.flattendeep-4.4.0.tgz#fb030917f86a3134e5bc9bec0d69e0013ddfedb2"
   integrity sha1-+wMJF/hqMTTlvJvsDWngAT3f7bI=
 
+lodash.isarguments@^3.0.0:
+  version "3.1.0"
+  resolved "https://registry.yarnpkg.com/lodash.isarguments/-/lodash.isarguments-3.1.0.tgz#2f573d85c6a24289ff00663b491c1d338ff3458a"
+  integrity sha1-L1c9hcaiQon/AGY7SRwdM4/zRYo=
+
+lodash.isarray@^3.0.0:
+  version "3.0.4"
+  resolved "https://registry.yarnpkg.com/lodash.isarray/-/lodash.isarray-3.0.4.tgz#79e4eb88c36a8122af86f844aa9bcd851b5fbb55"
+  integrity sha1-eeTriMNqgSKvhvhEqpvNhRtfu1U=
+
+lodash.isequal@^3.0:
+  version "3.0.4"
+  resolved "https://registry.yarnpkg.com/lodash.isequal/-/lodash.isequal-3.0.4.tgz#1c35eb3b6ef0cd1ff51743e3ea3cf7fdffdacb64"
+  integrity sha1-HDXrO27wzR/1F0Pj6jz3/f/ay2Q=
+  dependencies:
+    lodash._baseisequal "^3.0.0"
+    lodash._bindcallback "^3.0.0"
+
 lodash.isequal@^4.5.0:
   version "4.5.0"
   resolved "https://registry.yarnpkg.com/lodash.isequal/-/lodash.isequal-4.5.0.tgz#415c4478f2bcc30120c22ce10ed3226f7d3e18e0"
   integrity sha1-QVxEePK8wwEgwizhDtMib30+GOA=
 
+lodash.istypedarray@^3.0.0:
+  version "3.0.6"
+  resolved "https://registry.yarnpkg.com/lodash.istypedarray/-/lodash.istypedarray-3.0.6.tgz#c9a477498607501d8e8494d283b87c39281cef62"
+  integrity sha1-yaR3SYYHUB2OhJTSg7h8OSgc72I=
+
+lodash.keys@^3.0.0:
+  version "3.1.2"
+  resolved "https://registry.yarnpkg.com/lodash.keys/-/lodash.keys-3.1.2.tgz#4dbc0472b156be50a0b286855d1bd0b0c656098a"
+  integrity sha1-TbwEcrFWvlCgsoaFXRvQsMZWCYo=
+  dependencies:
+    lodash._getnative "^3.0.0"
+    lodash.isarguments "^3.0.0"
+    lodash.isarray "^3.0.0"
+
 lodash.memoize@^4.1.2:
   version "4.1.2"
   resolved "https://registry.yarnpkg.com/lodash.memoize/-/lodash.memoize-4.1.2.tgz#bcc6c49a42a2840ed997f323eada5ecd182e0bfe"