some touch ups on unit

public/app/core/components/Picker/Unit/UnitGroup.tsx

@@ -14,6 +14,15 @@ export default class UnitGroup extends PureComponent<ExtendedGroupProps, State>
     expanded: false,
     expanded: false,
   };
   };
 
 
+  componentDidMount() {
+    const value = this.props.selectProps.value[this.props.selectProps.value.length - 1].value;
+    console.log(value);
+
+    if (value && this.props.options.some(option => option.value === value)) {
+      this.setState({ expanded: true });
+    }
+  }
+
   componentDidUpdate(nextProps) {
   componentDidUpdate(nextProps) {
     if (nextProps.selectProps.inputValue !== '') {
     if (nextProps.selectProps.inputValue !== '') {
       this.setState({ expanded: true });
       this.setState({ expanded: true });

public/app/core/components/Picker/Unit/UnitPicker.tsx

@@ -8,11 +8,16 @@ import kbn from '../../../utils/kbn';
 interface Props {
 interface Props {
   onSelected: (item: any) => {} | void;
   onSelected: (item: any) => {} | void;
   defaultValue?: string;
   defaultValue?: string;
+  width?: number;
 }
 }
 
 
 export default class UnitPicker extends PureComponent<Props> {
 export default class UnitPicker extends PureComponent<Props> {
+  static defaultProps = {
+    width: 12,
+  };
+
   render() {
   render() {
-    const { defaultValue, onSelected } = this.props;
+    const { defaultValue, onSelected, width } = this.props;
 
 
     const unitGroups = kbn.getUnitFormats();
     const unitGroups = kbn.getUnitFormats();
 
 
@@ -42,6 +47,13 @@ export default class UnitPicker extends PureComponent<Props> {
           overflowY: 'auto',
           overflowY: 'auto',
           position: 'relative',
           position: 'relative',
         } as React.CSSProperties),
         } as React.CSSProperties),
+      valueContainer: () =>
+        ({
+          overflow: 'hidden',
+          textOverflow: 'ellipsis',
+          maxWidth: '90px',
+          whiteSpace: 'nowrap',
+        } as React.CSSProperties),
     };
     };
 
 
     const value = groupOptions.map(group => {
     const value = groupOptions.map(group => {
@@ -51,7 +63,7 @@ export default class UnitPicker extends PureComponent<Props> {
     return (
     return (
       <Select
       <Select
         classNamePrefix="gf-form-select-box"
         classNamePrefix="gf-form-select-box"
-        className="width-20 gf-form-input--form-dropdown"
+        className={`width-${width} gf-form-input--form-dropdown`}
         defaultValue={value}
         defaultValue={value}
         isSearchable={true}
         isSearchable={true}
         options={groupOptions}
         options={groupOptions}

public/app/plugins/panel/gauge/module.tsx

@@ -58,7 +58,7 @@ class GaugeOptions extends PureComponent<PanelOptionsProps<Options>> {
             <Label width={5}>Stat</Label>
             <Label width={5}>Stat</Label>
             <SimplePicker
             <SimplePicker
               defaultValue={statOptions.find(option => option.value === this.props.options.stat.value)}
               defaultValue={statOptions.find(option => option.value === this.props.options.stat.value)}
-              width={11}
+              width={12}
               options={statOptions}
               options={statOptions}
               getOptionLabel={i => i.text}
               getOptionLabel={i => i.text}
               getOptionValue={i => i.value}
               getOptionValue={i => i.value}