From 417f6ceeb62e81e905b05427cbbd7c369309b3e9 Mon Sep 17 00:00:00 2001
From: Andrej Ocenas <mr.ocenas@gmail.com>
Date: Fri, 9 Jun 2023 10:54:06 +0200
Subject: [PATCH] Grafana/ui: Fix margin in RadioButtonGroup option when only
 icon is present (#68899)

---
 .../src/components/Forms/RadioButtonGroup/RadioButtonGroup.tsx | 3 ++-
 1 file changed, 2 insertions(+), 1 deletion(-)

diff --git a/packages/grafana-ui/src/components/Forms/RadioButtonGroup/RadioButtonGroup.tsx b/packages/grafana-ui/src/components/Forms/RadioButtonGroup/RadioButtonGroup.tsx
index 20e430a526c..2454124a82e 100644
--- a/packages/grafana-ui/src/components/Forms/RadioButtonGroup/RadioButtonGroup.tsx
+++ b/packages/grafana-ui/src/components/Forms/RadioButtonGroup/RadioButtonGroup.tsx
@@ -75,6 +75,7 @@ export function RadioButtonGroup<T>({
       {options.map((opt, i) => {
         const isItemDisabled = disabledOptions && opt.value && disabledOptions.includes(opt.value);
         const icon = opt.icon ? toIconName(opt.icon) : undefined;
+        const hasNonIconPart = Boolean(opt.imgUrl || opt.label || opt.component);
 
         return (
           <RadioButton
@@ -91,7 +92,7 @@ export function RadioButtonGroup<T>({
             fullWidth={fullWidth}
             ref={value === opt.value ? activeButtonRef : undefined}
           >
-            {icon && <Icon name={icon} className={styles.icon} />}
+            {icon && <Icon name={icon} className={cx(hasNonIconPart && styles.icon)} />}
             {opt.imgUrl && <img src={opt.imgUrl} alt={opt.label} className={styles.img} />}
             {opt.label} {opt.component ? <opt.component /> : null}
           </RadioButton>