From 899d6a5caac0ee314e76324e50a1c675ac978baa Mon Sep 17 00:00:00 2001
From: "grafana-delivery-bot[bot]"
 <132647405+grafana-delivery-bot[bot]@users.noreply.github.com>
Date: Tue, 11 Jul 2023 15:32:02 +0100
Subject: [PATCH] [v10.0.x] UI/Select: Adjust typing to support extended props
 (#71369)

UI/Select: Adjust typing to support extended props (#71211)

(cherry picked from commit f604bf6d686d3feec69bf1843ed9d3190ed037eb)

Co-authored-by: kay delaney <45561153+kaydelaney@users.noreply.github.com>
---
 packages/grafana-ui/src/components/Select/Select.tsx | 12 ++++++------
 .../grafana-ui/src/components/Select/SelectBase.tsx  |  6 ++++--
 2 files changed, 10 insertions(+), 8 deletions(-)

diff --git a/packages/grafana-ui/src/components/Select/Select.tsx b/packages/grafana-ui/src/components/Select/Select.tsx
index 8c0ed3d2c9f..d118d9ada33 100644
--- a/packages/grafana-ui/src/components/Select/Select.tsx
+++ b/packages/grafana-ui/src/components/Select/Select.tsx
@@ -12,11 +12,11 @@ import {
   VirtualizedSelectAsyncProps,
 } from './types';
 
-export function Select<T>(props: SelectCommonProps<T>) {
+export function Select<T, Rest = {}>(props: SelectCommonProps<T> & Rest) {
   return <SelectBase {...props} />;
 }
 
-export function MultiSelect<T>(props: MultiSelectCommonProps<T>) {
+export function MultiSelect<T, Rest = {}>(props: MultiSelectCommonProps<T> & Rest) {
   // @ts-ignore
   return <SelectBase {...props} isMulti />;
 }
@@ -26,15 +26,15 @@ export interface AsyncSelectProps<T> extends Omit<SelectCommonProps<T>, 'options
   value?: T | SelectableValue<T> | null;
 }
 
-export function AsyncSelect<T>(props: AsyncSelectProps<T>) {
+export function AsyncSelect<T, Rest = {}>(props: AsyncSelectProps<T> & Rest) {
   return <SelectBase {...props} />;
 }
 
-export function VirtualizedSelect<T>(props: VirtualizedSelectProps<T>) {
+export function VirtualizedSelect<T, Rest = {}>(props: VirtualizedSelectProps<T> & Rest) {
   return <SelectBase virtualized {...props} />;
 }
 
-export function AsyncVirtualizedSelect<T>(props: VirtualizedSelectAsyncProps<T>) {
+export function AsyncVirtualizedSelect<T, Rest = {}>(props: VirtualizedSelectAsyncProps<T> & Rest) {
   return <SelectBase virtualized {...props} />;
 }
 
@@ -43,7 +43,7 @@ interface AsyncMultiSelectProps<T> extends Omit<MultiSelectCommonProps<T>, 'opti
   value?: Array<SelectableValue<T>>;
 }
 
-export function AsyncMultiSelect<T>(props: AsyncMultiSelectProps<T>) {
+export function AsyncMultiSelect<T, Rest = {}>(props: AsyncMultiSelectProps<T> & Rest) {
   // @ts-ignore
   return <SelectBase {...props} isMulti />;
 }
diff --git a/packages/grafana-ui/src/components/Select/SelectBase.tsx b/packages/grafana-ui/src/components/Select/SelectBase.tsx
index eac330e6fb1..18c229bc6ec 100644
--- a/packages/grafana-ui/src/components/Select/SelectBase.tsx
+++ b/packages/grafana-ui/src/components/Select/SelectBase.tsx
@@ -87,7 +87,7 @@ const CustomControl = (props: any) => {
   );
 };
 
-export function SelectBase<T>({
+export function SelectBase<T, Rest = {}>({
   allowCustomValue = false,
   allowCreateWhileLoading = false,
   'aria-label': ariaLabel,
@@ -146,7 +146,8 @@ export function SelectBase<T>({
   isValidNewOption,
   formatOptionLabel,
   hideSelectedOptions,
-}: SelectBaseProps<T>) {
+  ...rest
+}: SelectBaseProps<T> & Rest) {
   const theme = useTheme2();
   const styles = getSelectStyles(theme);
 
@@ -365,6 +366,7 @@ export function SelectBase<T>({
         {...commonSelectProps}
         {...creatableProps}
         {...asyncSelectProps}
+        {...rest}
       />
     </>
   );