Change the behavior of selecting a pipeline agg when only one exists.

src/core_plugins/metrics/public/components/vis_editor/lib/agg_lookup.js

@@ -46,18 +46,16 @@ const byType = {
   top_10: _.omit(lookup, pipeline)
 };
 
-function isBasicAgg(item) {
+export function isBasicAgg(item) {
   return _.includes(Object.keys(byType.top_10), item.type);
 }
 
 export function createOptions(type = '_all', siblings = []) {
   let aggs = byType[type];
   if (!aggs)  aggs = byType._all;
-  let enablePipelines = siblings.some(isBasicAgg);
-  if (siblings.length <= 1) enablePipelines = false;
   return _(aggs)
     .map((label, value) => {
-      const disabled = _.includes(pipeline, value) ? !enablePipelines : false;
+      const disabled = false;
       return { label, value, disabled };
     })
     .sortBy('label')

src/core_plugins/metrics/public/components/vis_editor/series/timeseries/series.js

@@ -8,6 +8,7 @@ import SeriesConfig from './config';
 import Sortable from 'react-anything-sortable';
 import Tooltip from 'plugins/metrics/components/tooltip';
 import Split from 'plugins/metrics/components/vis_editor/split';
+import { isBasicAgg } from 'plugins/metrics/components/vis_editor/lib/agg_lookup';
 import {
   handleAdd,
   handleDelete,
@@ -19,6 +20,22 @@ export default React.createClass({
   renderRow(row, index, items) {
     const { props } = this;
     const { model, panel, fields } = props;
+    const changeHandler = doc => {
+      // If we only have one sibling and the user changes to a pipeline
+      // agg we are going to add the pipeline instead of changing the
+      // current item.
+      if (items.length === 1 && !isBasicAgg(doc)) {
+        handleAdd.call(null, props, () => {
+          const metric = newMetricAggFn();
+          metric.type = doc.type;
+          const incompatPipelines = ['calculation', 'series_agg'];
+          if (!_.contains(incompatPipelines, doc.type)) metric.field = doc.id;
+          return metric;
+        });
+      } else {
+        handleChange.call(null, props, doc);
+      }
+    };
     return (
       <Agg
         key={row.id}
@@ -28,7 +45,7 @@ export default React.createClass({
         model={row}
         onAdd={handleAdd.bind(null, props, newMetricAggFn)}
         onDelete={handleDelete.bind(null, props, row)}
-        onChange={handleChange.bind(null, props)}
+        onChange={changeHandler}
         disableDelete={items.length < 2}
         fields={fields}/>
     );

src/core_plugins/metrics/public/less/editor.less

@@ -57,7 +57,7 @@
     margin: 0 10px 0 0;
   }
 }
-.vis_editor__input { padding: 6px 10px; border-radius: @borderRadius; border: 1px solid @grayLight; }
+.vis_editor__input { padding: 8px 10px; border-radius: @borderRadius; border: 1px solid @grayLight; }
 .vis_editor__input-grows { .vis_editor__input; flex-grow: 1 }
 .vis_editor__row { display: flex; align-items: center; }
 .vis_editor__item { flex-grow: 1; }