root
/
grafana
mirror of https://github.com/grafana/grafana.git
1
0
Fork 0
Code Issues Actions 20 Packages Projects Releases Wiki Activity

Grafana UI: make menuPlacement customizable (#23499)

This commit is contained in:
Alex Khomenko 2020-04-10 18:03:27 +03:00 committed by GitHub
parent 1ff69db5cb
commit 6d1e323b78
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
2 changed files with 28 additions and 26 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

3
packages/grafana-ui/src/components/Select/SelectBase.tsx
View File

@ -86,6 +86,7 @@ export function SelectBase<T>({
loadingMessage = 'Loading options...', loadingMessage = 'Loading options...',
maxMenuHeight = 300, maxMenuHeight = 300,
menuPosition, menuPosition,
menuPlacement = 'auto',
noOptionsMessage = 'No options found', noOptionsMessage = 'No options found',
onBlur, onBlur,
onChange, onChange,
@ -158,7 +159,7 @@ export function SelectBase<T>({
isSearchable, isSearchable,
maxMenuHeight, maxMenuHeight,
menuIsOpen: isOpen, menuIsOpen: isOpen,
menuPlacement: 'auto', menuPlacement,
menuPosition, menuPosition,
menuShouldScrollIntoView: false, menuShouldScrollIntoView: false,
onBlur, onBlur,

51
packages/grafana-ui/src/components/Select/types.ts
View File

@ -5,43 +5,44 @@ import { FormInputSize } from '../Forms/types';
export type SelectValue<T> = T | SelectableValue<T> | T[] | Array<SelectableValue<T>>; export type SelectValue<T> = T | SelectableValue<T> | T[] | Array<SelectableValue<T>>;
export interface SelectCommonProps<T> { export interface SelectCommonProps<T> {
allowCustomValue?: boolean;
autoFocus?: boolean;
backspaceRemovesValue?: boolean;
className?: string; className?: string;
options?: Array<SelectableValue<T>>; components?: any;
defaultValue?: any; defaultValue?: any;
inputValue?: string; disabled?: boolean;
value?: SelectValue<T>; formatCreateLabel?: (input: string) => string;
getOptionLabel?: (item: SelectableValue<T>) => string; getOptionLabel?: (item: SelectableValue<T>) => string;
getOptionValue?: (item: SelectableValue<T>) => string; getOptionValue?: (item: SelectableValue<T>) => string;
onCreateOption?: (value: string) => void; inputValue?: string;
isClearable?: boolean;
isLoading?: boolean;
isMulti?: boolean;
isOpen?: boolean;
isSearchable?: boolean;
maxMenuHeight?: number;
menuPlacement?: 'auto' | 'bottom' | 'top';
menuPosition?: 'fixed' | 'absolute';
noOptionsMessage?: string;
onBlur?: () => void;
onChange: (value: SelectableValue<T>) => {} | void; onChange: (value: SelectableValue<T>) => {} | void;
onCloseMenu?: () => void;
onCreateOption?: (value: string) => void;
onInputChange?: (label: string) => void; onInputChange?: (label: string) => void;
onKeyDown?: (event: React.KeyboardEvent) => void; onKeyDown?: (event: React.KeyboardEvent) => void;
placeholder?: string;
disabled?: boolean;
isSearchable?: boolean;
isClearable?: boolean;
autoFocus?: boolean;
openMenuOnFocus?: boolean;
onBlur?: () => void;
maxMenuHeight?: number;
isLoading?: boolean;
noOptionsMessage?: string;
isMulti?: boolean;
backspaceRemovesValue?: boolean;
isOpen?: boolean;
components?: any;
onOpenMenu?: () => void; onOpenMenu?: () => void;
onCloseMenu?: () => void; openMenuOnFocus?: boolean;
tabSelectsValue?: boolean; options?: Array<SelectableValue<T>>;
formatCreateLabel?: (input: string) => string; placeholder?: string;
allowCustomValue?: boolean;
width?: number;
size?: FormInputSize;
/** item to be rendered in front of the input */ /** item to be rendered in front of the input */
prefix?: JSX.Element | string | null; prefix?: JSX.Element | string | null;
/** Use a custom element to control Select. A proper ref to the renderControl is needed if 'portal' isn't set to null*/ /** Use a custom element to control Select. A proper ref to the renderControl is needed if 'portal' isn't set to null*/
renderControl?: ControlComponent<T>; renderControl?: ControlComponent<T>;
menuPosition?: 'fixed' | 'absolute'; size?: FormInputSize;
tabSelectsValue?: boolean;
value?: SelectValue<T>;
width?: number;
} }
export interface SelectAsyncProps<T> { export interface SelectAsyncProps<T> {