convert to emotion

Summary:
My benchmarks have shown react-emotion to be faster than the current implementation of `styled`. For this reason, I am converting all styling to [emotion](https://emotion.sh).

Benchmark results:
{F136839093}

The syntax is very similar between the two libraries. The main difference is that emotion only allows a single function for the whole style attribute, whereas the old implementation had functions for every style-attirbute.

Before:
```
{
  color: props => props.color,
  fontSize: props => props.size,
}
```

After:
```
props => ({
  color: props.color,
  fontSize: props.size,
})
```

Reviewed By: jknoxville

Differential Revision: D9479893

fbshipit-source-id: 2c39e4618f7e52ceacb67bbec8ae26114025723f

src/PluginContainer.js

@@ -10,7 +10,14 @@ import type Client from './Client.js';
 import type BaseDevice from './devices/BaseDevice.js';
 
 import {SonarDevicePlugin} from './plugin.js';
-import {ErrorBoundary, Component, FlexColumn, FlexRow, colors} from 'sonar';
+import {
+  ErrorBoundary,
+  Component,
+  FlexColumn,
+  FlexRow,
+  colors,
+  styled,
+} from 'sonar';
 import React from 'react';
 import {connect} from 'react-redux';
 import {setPluginState} from './reducers/pluginStates.js';
@@ -18,14 +25,14 @@ import {devicePlugins} from './device-plugins/index.js';
 import plugins from './plugins/index.js';
 import {activateMenuItems} from './MenuBar.js';
 
-const Container = FlexColumn.extends({
+const Container = styled(FlexColumn)({
   width: 0,
   flexGrow: 1,
   flexShrink: 1,
   backgroundColor: colors.white,
 });
 
-const SidebarContainer = FlexRow.extends({
+const SidebarContainer = styled(FlexRow)({
   backgroundColor: colors.light02,
   height: '100%',
   overflow: 'scroll',