From ea01ba35e90b1807169847b99a52def918e062c5 Mon Sep 17 00:00:00 2001
From: nickofthyme <nick.ryan.partridge@gmail.com>
Date: Wed, 21 Aug 2019 09:49:42 -0500
Subject: [PATCH] fix: pr comments

Remove legendId, fix safari max-height inheritance issue, remove uneeded legendList styles, revert
empty state flex value.
---
 src/components/_container.scss          | 2 +-
 src/components/chart.tsx                | 5 +----
 src/components/legend/_index.scss       | 1 -
 src/components/legend/_legend_list.scss | 3 ---
 src/components/legend/legend.tsx        | 8 +++-----
 5 files changed, 5 insertions(+), 14 deletions(-)
 delete mode 100644 src/components/legend/_legend_list.scss

diff --git a/src/components/_container.scss b/src/components/_container.scss
index bdcb537754..eb1576b225 100644
--- a/src/components/_container.scss
+++ b/src/components/_container.scss
@@ -3,7 +3,7 @@
  */
 
 .echContainer {
-  flex: 1 1 auto;
+  flex: 1;
   position: relative;
 
   &:hover {
diff --git a/src/components/chart.tsx b/src/components/chart.tsx
index ddbc0a1da2..8d58628155 100644
--- a/src/components/chart.tsx
+++ b/src/components/chart.tsx
@@ -4,7 +4,6 @@ import { Provider } from 'mobx-react';
 
 import { SpecsParser } from '../specs/specs_parser';
 import { ChartStore } from '../chart_types/xy_chart/store/chart_state';
-import { htmlIdGenerator } from '../utils/commons';
 import { AnnotationTooltip } from './annotation_tooltips';
 import { ChartResizer } from './chart_resizer';
 import { Crosshair } from './crosshair';
@@ -35,7 +34,6 @@ export class Chart extends React.Component<ChartProps, ChartState> {
     renderer: 'canvas',
   };
   private chartSpecStore: ChartStore;
-  private legendId: string;
   constructor(props: any) {
     super(props);
     this.chartSpecStore = new ChartStore();
@@ -48,7 +46,6 @@ export class Chart extends React.Component<ChartProps, ChartState> {
         legendPosition,
       });
     });
-    this.legendId = htmlIdGenerator()('legend');
   }
 
   static getContainerStyle = (size: any): CSSProperties => {
@@ -91,7 +88,7 @@ export class Chart extends React.Component<ChartProps, ChartState> {
     return (
       <Provider chartStore={this.chartSpecStore}>
         <div style={containerStyle} className={chartClassNames}>
-          <Legend legendId={this.legendId} />
+          <Legend />
           <SpecsParser>{this.props.children}</SpecsParser>
           <div className="echContainer">
             <ChartResizer />
diff --git a/src/components/legend/_index.scss b/src/components/legend/_index.scss
index 48c6d3a719..6b6f3997ff 100644
--- a/src/components/legend/_index.scss
+++ b/src/components/legend/_index.scss
@@ -1,4 +1,3 @@
 @import 'variables';
 @import 'legend';
-@import 'legend_list';
 @import 'legend_item';
diff --git a/src/components/legend/_legend_list.scss b/src/components/legend/_legend_list.scss
deleted file mode 100644
index 41d95552fe..0000000000
--- a/src/components/legend/_legend_list.scss
+++ /dev/null
@@ -1,3 +0,0 @@
-.echLegendList {
-  display: flex;
-}
diff --git a/src/components/legend/legend.tsx b/src/components/legend/legend.tsx
index bfdb6e9c8b..751c580ca6 100644
--- a/src/components/legend/legend.tsx
+++ b/src/components/legend/legend.tsx
@@ -10,7 +10,6 @@ import { Theme } from '../../utils/themes/theme';
 
 interface LegendProps {
   chartStore?: ChartStore; // FIX until we find a better way on ts mobx
-  legendId: string;
 }
 
 interface LegendState {
@@ -57,7 +56,6 @@ class LegendComponent extends React.Component<LegendProps, LegendState> {
   }
 
   render() {
-    const { legendId } = this.props;
     const {
       legendInitialized,
       chartInitialized,
@@ -73,7 +71,7 @@ class LegendComponent extends React.Component<LegendProps, LegendState> {
       return null;
     }
 
-    const legendStyle = this.getLegendStyle(postion, chartTheme);
+    const legendContainerStyle = this.getLegendStyle(postion, chartTheme);
     const legendListStyle = this.getLegendListStyle(postion, chartTheme);
     const legendClasses = classNames('echLegend', `echLegend--${postion}`, {
       'echLegend--debug': debug,
@@ -81,8 +79,8 @@ class LegendComponent extends React.Component<LegendProps, LegendState> {
     });
 
     return (
-      <div ref={this.echLegend} className={legendClasses} style={legendStyle} id={legendId}>
-        <div className="echLegendListContainer">
+      <div ref={this.echLegend} className={legendClasses}>
+        <div style={legendContainerStyle} className="echLegendListContainer">
           <div style={legendListStyle} className="echLegendList">
             {[...legendItems.values()].map(this.renderLegendElement)}
           </div>