From 34fc275743ff73c5f98c6d7d2aaff09b068ce649 Mon Sep 17 00:00:00 2001
From: Thomas Heyenbrock <thomas.heyenbrock@gmail.com>
Date: Tue, 14 May 2024 12:36:20 -0600
Subject: [PATCH] avoid Component.defaultProps for icon components

---
 .changeset/nervous-numbers-push.md                        | 5 +++++
 packages/graphiql-react/src/icons/{index.ts => index.tsx} | 7 +++++--
 2 files changed, 10 insertions(+), 2 deletions(-)
 create mode 100644 .changeset/nervous-numbers-push.md
 rename packages/graphiql-react/src/icons/{index.ts => index.tsx} (95%)

diff --git a/.changeset/nervous-numbers-push.md b/.changeset/nervous-numbers-push.md
new file mode 100644
index 00000000000..0ad8006a086
--- /dev/null
+++ b/.changeset/nervous-numbers-push.md
@@ -0,0 +1,5 @@
+---
+'@graphiql/react': patch
+---
+
+Avoid using deprecated Component.defaultProps for icon titles
diff --git a/packages/graphiql-react/src/icons/index.ts b/packages/graphiql-react/src/icons/index.tsx
similarity index 95%
rename from packages/graphiql-react/src/icons/index.ts
rename to packages/graphiql-react/src/icons/index.tsx
index bc4c4ad5758..34c0386ded6 100644
--- a/packages/graphiql-react/src/icons/index.ts
+++ b/packages/graphiql-react/src/icons/index.tsx
@@ -74,6 +74,9 @@ function generateIcon(
     .trimStart()
     .toLowerCase() + ' icon',
 ): FC<ComponentProps<'svg'>> {
-  RawComponent.defaultProps = { title };
-  return RawComponent;
+  function IconComponent(props: ComponentProps<'svg'>) {
+    return <RawComponent title={title} {...props} />;
+  }
+  IconComponent.displayName = RawComponent.name;
+  return IconComponent;
 }