Prometheus: Create AutoSizeInput with dynamic width (#45601)

* Autosize input for dynamic width

* Update

* Refactoring to use measureText util instead

* removed react fragment tags

* Add tests

* Use AutoSize input in legend, step and nested queries vector matcher

* Update

* Remove unused imports

Co-authored-by: Torkel Ödegaard <torkel@grafana.com>

packages/grafana-ui/src/components/Input/Input.tsx

@@ -43,7 +43,7 @@ export const Input = React.forwardRef<HTMLInputElement, Props>((props, ref) => {
   const styles = getInputStyles({ theme, invalid: !!invalid, width });
 
   return (
-    <div className={cx(styles.wrapper, className)}>
+    <div className={cx(styles.wrapper, className)} data-testid={'input-wrapper'}>
       {!!addonBefore && <div className={styles.addon}>{addonBefore}</div>}
 
       <div className={styles.inputWrapper}>