Merge pull request #785 from plotly/tweaks

Tweaks

Author: nicolaskruchten

src/components/containers/AnnotationAccordion.js

@@ -1,5 +1,5 @@
 import PlotlyFold from './PlotlyFold';
-import TraceRequiredPanel from './TraceRequiredPanel';
+import {LayoutPanel} from './derived';
 import {PanelMessage} from './PanelEmpty';
 import PropTypes from 'prop-types';
 import React, {Component} from 'react';
@@ -43,7 +43,7 @@ class AnnotationAccordion extends Component {
     };
 
     return (
-      <TraceRequiredPanel addAction={canAdd ? addAction : null}>
+      <LayoutPanel addAction={canAdd ? addAction : null}>
         {content ? (
           content
         ) : (
@@ -56,7 +56,7 @@ class AnnotationAccordion extends Component {
             <p>{_('Click on the + button above to add an annotation.')}</p>
           </PanelMessage>
         )}
-      </TraceRequiredPanel>
+      </LayoutPanel>
     );
   }
 }

src/components/containers/ImageAccordion.js

@@ -1,5 +1,5 @@
 import PlotlyFold from './PlotlyFold';
-import TraceRequiredPanel from './TraceRequiredPanel';
+import {LayoutPanel} from './derived';
 import PropTypes from 'prop-types';
 import React, {Component} from 'react';
 import {connectImageToLayout} from 'lib';
@@ -48,7 +48,7 @@ class ImageAccordion extends Component {
     };
 
     return (
-      <TraceRequiredPanel addAction={canAdd ? addAction : null}>
+      <LayoutPanel addAction={canAdd ? addAction : null}>
         {content ? (
           content
         ) : (
@@ -61,7 +61,7 @@ class ImageAccordion extends Component {
             <p>{_('Click on the + button above to add an image.')}</p>
           </PanelMessage>
         )}
-      </TraceRequiredPanel>
+      </LayoutPanel>
     );
   }
 }

src/components/containers/ShapeAccordion.js

@@ -1,5 +1,5 @@
 import PlotlyFold from './PlotlyFold';
-import TraceRequiredPanel from './TraceRequiredPanel';
+import {LayoutPanel} from './derived';
 import PropTypes from 'prop-types';
 import React, {Component} from 'react';
 import {connectShapeToLayout} from 'lib';
@@ -48,7 +48,7 @@ class ShapeAccordion extends Component {
     };
 
     return (
-      <TraceRequiredPanel addAction={canAdd ? addAction : null}>
+      <LayoutPanel addAction={canAdd ? addAction : null}>
         {content ? (
           content
         ) : (
@@ -61,7 +61,7 @@ class ShapeAccordion extends Component {
             <p>{_('Click on the + button above to add a shape.')}</p>
           </PanelMessage>
         )}
-      </TraceRequiredPanel>
+      </LayoutPanel>
     );
   }
 }

src/components/fields/DataSelector.js

@@ -95,6 +95,7 @@ export class UnconnectedDataSelector extends Component {
           value={this.fullValue}
           onChange={this.updatePlot}
           multi={this.is2D}
+          searchable={true}
           optionRenderer={this.context.dataSourceOptionRenderer}
           valueRenderer={this.context.dataSourceValueRenderer}
           clearable={true}

src/default_panels/StyleAxesPanel.js

@@ -12,7 +12,7 @@ import {
   Radio,
   TextEditor,
   PlotlySection,
-  TraceRequiredPanel,
+  LayoutPanel,
   AxesFold,
   AxisSide,
   RangesliderVisible,
@@ -26,7 +26,7 @@ class StyleAxesPanel extends Component {
   render() {
     const {localize: _} = this.context;
     return (
-      <TraceRequiredPanel>
+      <LayoutPanel>
         <AxesFold
           name={_('Titles')}
           axisFilter={axis => !(axis._name.includes('angular') || axis._subplot.includes('geo'))}
@@ -402,7 +402,7 @@ class StyleAxesPanel extends Component {
           <Numeric label={_('Thickness')} attr="spikethickness" units="px" />
           <ColorPicker label={_('Color')} attr="spikecolor" />
         </AxesFold>
-      </TraceRequiredPanel>
+      </LayoutPanel>
     );
   }
 }

src/default_panels/StyleLayoutPanel.js

@@ -9,7 +9,7 @@ import {
   Numeric,
   TextEditor,
   PlotlySection,
-  TraceRequiredPanel,
+  LayoutPanel,
   VisibilitySelect,
   HovermodeDropdown,
   Flaglist,
@@ -18,7 +18,7 @@ import {
 import {HoverColor} from '../components/fields/derived';
 
 const StyleLayoutPanel = (props, {localize: _}) => (
-  <TraceRequiredPanel>
+  <LayoutPanel>
     <PlotlyFold name={_('Defaults')}>
       <ColorPicker label={_('Plot Background')} attr="plot_bgcolor" />
       <ColorPicker label={_('Margin Color')} attr="paper_bgcolor" />
@@ -137,7 +137,7 @@ const StyleLayoutPanel = (props, {localize: _}) => (
         </HovermodeDropdown>
       </PlotlySection>
     </PlotlyFold>
-  </TraceRequiredPanel>
+  </LayoutPanel>
 );
 
 StyleLayoutPanel.contextTypes = {