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;