From 706d3d116194c30ade2fa8f817e723f4edabb278 Mon Sep 17 00:00:00 2001
From: kay delaney <45561153+kaydelaney@users.noreply.github.com>
Date: Tue, 26 Apr 2022 12:51:42 +0100
Subject: [PATCH] UI/Field: Undefined defaults no longer override child props
 (#48182)

Closes #48131
---
 packages/grafana-ui/src/components/Forms/Field.tsx | 13 ++++++++++++-
 1 file changed, 12 insertions(+), 1 deletion(-)

diff --git a/packages/grafana-ui/src/components/Forms/Field.tsx b/packages/grafana-ui/src/components/Forms/Field.tsx
index 82ab1d5d949..a7c7b406c08 100644
--- a/packages/grafana-ui/src/components/Forms/Field.tsx
+++ b/packages/grafana-ui/src/components/Forms/Field.tsx
@@ -97,11 +97,12 @@ export const Field: React.FC<FieldProps> = ({
       label
     );
 
+  const childProps = deleteUndefinedProps({ invalid, disabled, loading });
   return (
     <div className={cx(styles.field, horizontal && styles.fieldHorizontal, className)} {...otherProps}>
       {labelElement}
       <div>
-        {React.cloneElement(children, { invalid, disabled, loading })}
+        {React.cloneElement(children, childProps)}
         {invalid && error && !horizontal && (
           <div
             className={cx(styles.fieldValidationWrapper, {
@@ -125,3 +126,13 @@ export const Field: React.FC<FieldProps> = ({
     </div>
   );
 };
+
+function deleteUndefinedProps<T extends Object>(obj: T): Partial<T> {
+  for (const key in obj) {
+    if (obj[key] === undefined) {
+      delete obj[key];
+    }
+  }
+
+  return obj;
+}