Commit 84df0e2d by Torkel Ödegaard

Added custom scrollbar to select component

parent 9e4547f7
......@@ -28,8 +28,8 @@ class CustomScrollbar extends PureComponent<Props> {
<Scrollbars
className={customClassName}
autoHeight={true}
autoHeightMin={'100%'}
autoHeightMax={'100%'}
autoHeightMin={'inherit'}
autoHeightMax={'inherit'}
renderTrackHorizontal={props => <div {...props} className="track-horizontal" />}
renderTrackVertical={props => <div {...props} className="track-vertical" />}
renderThumbHorizontal={props => <div {...props} className="thumb-horizontal" />}
......
......@@ -3,12 +3,14 @@ import classNames from 'classnames';
import React, { PureComponent } from 'react';
import { default as ReactSelect } from 'react-select';
import { default as ReactAsyncSelect } from 'react-select/lib/Async';
import { components } from 'react-select';
// Components
import { Option, SingleValue } from './PickerOption';
import IndicatorsContainer from './IndicatorsContainer';
import NoOptionsMessage from './NoOptionsMessage';
import ResetStyles from './ResetStyles';
import CustomScrollbar from '../CustomScrollbar/CustomScrollbar';
export interface SelectOptionItem {
label?: string;
......@@ -51,6 +53,14 @@ interface AsyncProps {
loadingMessage?: () => string;
}
export const MenuList = props => {
return (
<components.MenuList {...props}>
<CustomScrollbar autoHide={false}>{props.children}</CustomScrollbar>
</components.MenuList>
);
};
export class Select extends PureComponent<CommonProps & SelectProps> {
static defaultProps = {
width: null,
......@@ -106,6 +116,7 @@ export class Select extends PureComponent<CommonProps & SelectProps> {
Option,
SingleValue,
IndicatorsContainer,
MenuList,
}}
defaultValue={defaultValue}
value={value}
......
......@@ -79,6 +79,7 @@ $select-input-bg-disabled: $input-bg-disabled;
.gf-form-select-box__option {
border-left: 2px solid transparent;
white-space: nowrap;
background-color: $input-bg;
&.gf-form-select-box__option--is-focused {
color: $dropdownLinkColorHover;
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment