From 6e64eb0487d509866242fc668a27caf6368e7958 Mon Sep 17 00:00:00 2001
From: Kyle McDonald <kyle@knock.app>
Date: Thu, 31 Oct 2024 17:19:50 -0500
Subject: [PATCH] feat: add directional arrow keys to kbd component (#305)

---
 .changeset/hip-bats-burn.md         |  5 +++++
 packages/kbd/src/Kbd/Kbd.helpers.ts | 16 ++++++++++++++++
 2 files changed, 21 insertions(+)
 create mode 100644 .changeset/hip-bats-burn.md

diff --git a/.changeset/hip-bats-burn.md b/.changeset/hip-bats-burn.md
new file mode 100644
index 00000000..e13d0d2a
--- /dev/null
+++ b/.changeset/hip-bats-burn.md
@@ -0,0 +1,5 @@
+---
+"@telegraph/kbd": patch
+---
+
+add directional arrow keys to kbd
diff --git a/packages/kbd/src/Kbd/Kbd.helpers.ts b/packages/kbd/src/Kbd/Kbd.helpers.ts
index 7e565a41..bf6d6536 100644
--- a/packages/kbd/src/Kbd/Kbd.helpers.ts
+++ b/packages/kbd/src/Kbd/Kbd.helpers.ts
@@ -31,5 +31,21 @@ export const getIconOrKey = (key: string) => {
     return "Ctrl";
   }
 
+  if (key === "ArrowRight") {
+    return Lucide.ArrowRight;
+  }
+
+  if (key === "ArrowLeft") {
+    return Lucide.ArrowLeft;
+  }
+
+  if (key === "ArrowDown") {
+    return Lucide.ArrowDown;
+  }
+
+  if (key === "ArrowUp") {
+    return Lucide.ArrowUp;
+  }
+
   return key.length === 1 ? key.toUpperCase() : key;
 };