Merge branch 'feat/input-ref-search-bar' of github.com:devtron-labs/devtron-fe-common-lib into feat/input-ref-search-bar

Author: Elessar1802

src/Common/SearchBar/SearchBar.component.tsx

@@ -113,6 +113,14 @@ const SearchBar = ({
         }
     }
 
+    const inputCallbackRef: React.RefCallback<HTMLInputElement> = (node = null) => {
+        if (inputProps.ref) {
+            // eslint-disable-next-line no-param-reassign
+            inputProps.ref.current = node
+        }
+        inputRef.current = node
+    }
+
     return (
         <div className={containerClassName}>
             <div
@@ -130,7 +138,7 @@ const SearchBar = ({
                     } ${noBackgroundAndBorder ? 'dc__no-background' : 'bc-n50'}`}
                     onChange={handleChange}
                     onKeyDown={handleKeyDown}
-                    ref={inputRef}
+                    ref={inputCallbackRef}
                 />
                 {/* TODO: Sync with product since it should have ic-enter in case of not applied */}
                 {showClearButton && (

src/Common/SearchBar/types.ts

@@ -32,7 +32,8 @@ export interface SearchBarProps {
     /**
      * Input props for the search input
      */
-    inputProps?: React.InputHTMLAttributes<HTMLInputElement>
+    inputProps?: React.InputHTMLAttributes<HTMLInputElement> &
+        Partial<Record<'ref', React.MutableRefObject<HTMLInputElement>>>
     /**
      * Class name for the container; can be used for handling width
      */