From 47ebede5e1ce40d780f4c3629aa44281f83f036d Mon Sep 17 00:00:00 2001
From: Fredrik Mikal Wold <fredrik.wold@bouvet.no>
Date: Wed, 3 Jul 2024 10:14:25 +0200
Subject: [PATCH] fix(Icon): improve icon type definition by making it a
 descriminated union on name and data (#3547)

---
 .../src/components/Icon/Icon.tsx              | 51 +++++++++++++------
 1 file changed, 35 insertions(+), 16 deletions(-)

diff --git a/packages/eds-core-react/src/components/Icon/Icon.tsx b/packages/eds-core-react/src/components/Icon/Icon.tsx
index 67960d185b..61bd587c39 100644
--- a/packages/eds-core-react/src/components/Icon/Icon.tsx
+++ b/packages/eds-core-react/src/components/Icon/Icon.tsx
@@ -64,22 +64,41 @@ const findIcon = (name: string, data: IconData, size: number) => {
   return { icon, count }
 }
 
-export type IconProps = {
-  /** Title for icon when used semantically */
-  title?: string
-  /** Color */
-  color?: string
-  /** Size */
-  size?: 16 | 18 | 24 | 32 | 40 | 48
-  /** Rotation */
-  rotation?: 0 | 90 | 180 | 270
-  /** Name */
-  name?: Name
-  /** Manually specify which icon data to use */
-  data?: IconData
-  /** @ignore */
-  ref?: Ref<SVGSVGElement>
-} & SVGProps<SVGSVGElement>
+export type IconProps = (
+  | {
+      /** Title for icon when used semantically */
+      title?: string
+      /** Color */
+      color?: string
+      /** Size */
+      size?: 16 | 18 | 24 | 32 | 40 | 48
+      /** Rotation */
+      rotation?: 0 | 90 | 180 | 270
+      /** Name */
+      name: Name
+      /** Manually specify which icon data to use */
+      data?: IconData
+      /** @ignore */
+      ref?: Ref<SVGSVGElement>
+    }
+  | {
+      /** Title for icon when used semantically */
+      title?: string
+      /** Color */
+      color?: string
+      /** Size */
+      size?: 16 | 18 | 24 | 32 | 40 | 48
+      /** Rotation */
+      rotation?: 0 | 90 | 180 | 270
+      /** Name */
+      name?: Name
+      /** Manually specify which icon data to use */
+      data: IconData
+      /** @ignore */
+      ref?: Ref<SVGSVGElement>
+    }
+) &
+  SVGProps<SVGSVGElement>
 
 export const Icon = forwardRef<SVGSVGElement, IconProps>(function Icon(
   { size, color = 'currentColor', name, rotation, title, data, ...rest },