Rename colorsPalette util to namedColorsPalette

packages/grafana-ui/src/components/ColorPicker/ColorPicker.tsx

@@ -3,7 +3,7 @@ import PopperController from '../Tooltip/PopperController';
 import Popper, { RenderPopperArrowFn } from '../Tooltip/Popper';
 import { ColorPickerPopover } from './ColorPickerPopover';
 import { Themeable, GrafanaTheme } from '../../types';
-import { getColorFromHexRgbOrName } from '../../utils/colorsPalette';
+import { getColorFromHexRgbOrName } from '../../utils/namedColorsPalette';
 import { SeriesColorPickerPopover } from './SeriesColorPickerPopover';
 import propDeprecationWarning from '../../utils/propDeprecationWarning';
 
@@ -61,7 +61,7 @@ export const colorPickerFactory = <T extends ColorPickerProps>(
       };
 
       return (
-        <PopperController content={popoverElement} hideAfter={500}>
+        <PopperController content={popoverElement} hideAfter={500000}>
           {(showPopper, hidePopper, popperProps) => {
             return (
               <>
@@ -83,7 +83,12 @@ export const colorPickerFactory = <T extends ColorPickerProps>(
                     onMouseLeave: hidePopper,
                   })
                 ) : (
-                  <div ref={this.pickerTriggerRef} onClick={showPopper} onMouseLeave={hidePopper} className="sp-replacer sp-light">
+                  <div
+                    ref={this.pickerTriggerRef}
+                    onClick={showPopper}
+                    onMouseLeave={hidePopper}
+                    className="sp-replacer sp-light"
+                  >
                     <div className="sp-preview">
                       <div
                         className="sp-preview-inner"

packages/grafana-ui/src/components/ColorPicker/ColorPickerPopover.tsx

@@ -1,6 +1,6 @@
 import React from 'react';
 import NamedColorsPicker from './NamedColorsPalette';
-import { getColorName, getColorFromHexRgbOrName } from '../..//utils/colorsPalette';
+import { getColorName, getColorFromHexRgbOrName } from '../../utils/namedColorsPalette';
 import { ColorPickerProps, handleColorPickerPropsDeprecation } from './ColorPicker';
 import { GrafanaTheme, Themeable } from '../../types';
 import { PopperContentProps } from '../Tooltip/PopperController';

packages/grafana-ui/src/components/ColorPicker/NamedColorsGroup.tsx

@@ -1,6 +1,6 @@
 import React, { FunctionComponent } from 'react';
 import { Themeable, GrafanaTheme } from '../../types';
-import { ColorDefinition, getColorForTheme } from '../../utils/colorsPalette';
+import { ColorDefinition, getColorForTheme } from '../../utils/namedColorsPalette';
 import { Color } from 'csstype';
 import { find, upperFirst } from 'lodash';
 

packages/grafana-ui/src/components/ColorPicker/NamedColorsPalette.story.tsx

@@ -1,7 +1,7 @@
 import React, { FunctionComponent } from 'react';
 import { storiesOf } from '@storybook/react';
 import NamedColorsPalette from './NamedColorsPalette';
-import { getColorName } from '@grafana/ui/src/utils/colorsPalette';
+import { getColorName } from '../../utils/namedColorsPalette';
 import { withKnobs, select } from '@storybook/addon-knobs';
 
 const CenteredStory: FunctionComponent<{}> = ({ children }) => {

packages/grafana-ui/src/components/ColorPicker/NamedColorsPalette.tsx

@@ -1,5 +1,5 @@
 import React from 'react';
-import { Color, ColorsPalette } from '../../utils/colorsPalette';
+import { Color, ColorsPalette } from '../../utils/namedColorsPalette';
 import { Themeable } from '../../types/index';
 import NamedColorsGroup from './NamedColorsGroup';
 

packages/grafana-ui/src/components/ColorPicker/SpectrumPalette.tsx

@@ -2,7 +2,7 @@ import React from 'react';
 import { CustomPicker, ColorResult } from 'react-color';
 
 import { Saturation, Hue, Alpha } from 'react-color/lib/components/common';
-import { getColorFromHexRgbOrName } from '../../utils/colorsPalette';
+import { getColorFromHexRgbOrName } from '../../utils/namedColorsPalette';
 import tinycolor from 'tinycolor2';
 import ColorInput from './ColorInput';
 import { Themeable, GrafanaTheme } from '../../types';

packages/grafana-ui/src/components/Gauge/Gauge.tsx

@@ -1,18 +1,11 @@
 import React, { PureComponent } from 'react';
 import $ from 'jquery';
 
-import {
-  ValueMapping,
-  Threshold,
-  MappingType,
-  BasicGaugeColor,
-  ValueMap,
-  RangeMap,
-} from '../../types/panel';
+import { ValueMapping, Threshold, MappingType, BasicGaugeColor, ValueMap, RangeMap } from '../../types/panel';
 import { TimeSeriesVMs } from '../../types/series';
 import { getValueFormat } from '../../utils/valueFormats/valueFormats';
-import { getColorFromHexRgbOrName } from '@grafana/ui/src/utils/colorsPalette';
-import { GrafanaTheme } from '@grafana/ui/src/types';
+import { GrafanaTheme } from '../../types';
+import { getColorFromHexRgbOrName } from '../../utils/namedColorsPalette';
 
 type TimeSeriesValue = string | number | null;
 

packages/grafana-ui/src/components/ThresholdsEditor/ThresholdsEditor.tsx

@@ -3,7 +3,7 @@ import { Threshold, Themeable } from '../../types';
 import { ColorPicker } from '../ColorPicker/ColorPicker';
 import { PanelOptionsGroup } from '../PanelOptionsGroup/PanelOptionsGroup';
 import { colors } from '../../utils';
-import { getColorFromHexRgbOrName } from '@grafana/ui/src/utils/colorsPalette';
+import { getColorFromHexRgbOrName } from '@grafana/ui';
 
 export interface Props extends Themeable {
   thresholds: Threshold[];

packages/grafana-ui/src/utils/index.ts

@@ -1,3 +1,4 @@
 export * from './processTimeSeries';
 export * from './valueFormats/valueFormats';
 export * from './colors';
+export * from './namedColorsPalette';

packages/grafana-ui/src/utils/namedColorsPalette.test.ts

@@ -1,8 +1,13 @@
-import { getColorName, getColorDefinition, getColorByName, SemiDarkBlue, getColorFromHexRgbOrName } from './colorsPalette';
-import { GrafanaTheme } from '../types';
+import {
+  getColorName,
+  getColorDefinition,
+  getColorByName,
+  SemiDarkBlue,
+  getColorFromHexRgbOrName,
+} from './namedColorsPalette';
+import { GrafanaTheme } from '../types/index';
 
 describe('colors', () => {
-
   describe('getColorDefinition', () => {
     it('returns undefined for unknown hex', () => {
       expect(getColorDefinition('#ff0000')).toBeUndefined();
@@ -33,7 +38,6 @@ describe('colors', () => {
     it('returns color definiton for known color', () => {
       expect(getColorByName(SemiDarkBlue.name)).toBe(SemiDarkBlue);
     });
-
   });
   describe('getColorFromHexRgbOrName', () => {
     it('returns undefined for unknown color', () => {
@@ -44,7 +48,7 @@ describe('colors', () => {
       expect(getColorFromHexRgbOrName(SemiDarkBlue.name)).toBe(SemiDarkBlue.variants.dark);
     });
 
-    it('returns correct variant\'s hex for known color if theme specified', () => {
+    it("returns correct variant's hex for known color if theme specified", () => {
       expect(getColorFromHexRgbOrName(SemiDarkBlue.name, GrafanaTheme.Light)).toBe(SemiDarkBlue.variants.light);
     });