diff --git a/packages/grafana-ui/src/components/Select/SelectBase.test.tsx b/packages/grafana-ui/src/components/Select/SelectBase.test.tsx index bdfb164c6c0..97d877616fd 100644 --- a/packages/grafana-ui/src/components/Select/SelectBase.test.tsx +++ b/packages/grafana-ui/src/components/Select/SelectBase.test.tsx @@ -206,5 +206,16 @@ describe('SelectBase', () => { { action: 'select-option', name: undefined, option: undefined } ); }); + + it('hideSelectedOptions prop - when false does not hide selected', async () => { + render(); + + const selectEl = screen.getByLabelText('My select'); + + await selectOptionInTest(selectEl, 'Option 2'); + await userEvent.click(screen.getByText(/option 2/i)); + const menuOptions = screen.getAllByLabelText('Select option'); + expect(menuOptions).toHaveLength(2); + }); }); }); diff --git a/packages/grafana-ui/src/components/Select/SelectBase.tsx b/packages/grafana-ui/src/components/Select/SelectBase.tsx index 3241839dbf9..065de3928b0 100644 --- a/packages/grafana-ui/src/components/Select/SelectBase.tsx +++ b/packages/grafana-ui/src/components/Select/SelectBase.tsx @@ -144,6 +144,7 @@ export function SelectBase({ width, isValidNewOption, formatOptionLabel, + hideSelectedOptions, }: SelectBaseProps) { const theme = useTheme2(); const styles = getSelectStyles(theme); @@ -222,6 +223,7 @@ export function SelectBase({ filterOption, getOptionLabel, getOptionValue, + hideSelectedOptions, inputValue, invalid, isClearable, diff --git a/packages/grafana-ui/src/components/Select/types.ts b/packages/grafana-ui/src/components/Select/types.ts index e8c960cd535..f223ffba58b 100644 --- a/packages/grafana-ui/src/components/Select/types.ts +++ b/packages/grafana-ui/src/components/Select/types.ts @@ -37,6 +37,7 @@ export interface SelectCommonProps { formatCreateLabel?: (input: string) => string; getOptionLabel?: (item: SelectableValue) => React.ReactNode; getOptionValue?: (item: SelectableValue) => string; + hideSelectedOptions?: boolean; inputValue?: string; invalid?: boolean; isClearable?: boolean;