From f77fe9e0c633317fae02c0a4cff0b61b61637209 Mon Sep 17 00:00:00 2001
From: Marcin Maciaszczyk <marcin@plural.sh>
Date: Fri, 4 Oct 2024 11:56:22 +0200
Subject: [PATCH 1/2] add wrappers for menu and menu item

---
 src/components/Menu.tsx     | 18 ++++++++++++++++++
 src/components/MenuItem.tsx | 18 ++++++++++++++++++
 src/index.ts                |  4 +++-
 3 files changed, 39 insertions(+), 1 deletion(-)
 create mode 100644 src/components/Menu.tsx
 create mode 100644 src/components/MenuItem.tsx

diff --git a/src/components/Menu.tsx b/src/components/Menu.tsx
new file mode 100644
index 00000000..62ff93f0
--- /dev/null
+++ b/src/components/Menu.tsx
@@ -0,0 +1,18 @@
+import { Menu as HonorableMenu } from 'honorable'
+import type { MenuProps as HonorableMenuProps } from 'honorable'
+import { type MutableRefObject, forwardRef } from 'react'
+
+export type MenuProps = HonorableMenuProps
+
+function MenuRef({ ...props }: MenuProps, ref: MutableRefObject<any>) {
+  return (
+    <HonorableMenu
+      ref={ref}
+      {...props}
+    />
+  )
+}
+
+const Menu = forwardRef(MenuRef)
+
+export default Menu
diff --git a/src/components/MenuItem.tsx b/src/components/MenuItem.tsx
new file mode 100644
index 00000000..4e80a999
--- /dev/null
+++ b/src/components/MenuItem.tsx
@@ -0,0 +1,18 @@
+import { MenuItem as HonorableMenuItem } from 'honorable'
+import type { MenuItemProps as HonorableMenuItemProps } from 'honorable'
+import { type MutableRefObject, forwardRef } from 'react'
+
+export type MenuItemProps = HonorableMenuItemProps
+
+function MenuItemRef({ ...props }: MenuItemProps, ref: MutableRefObject<any>) {
+  return (
+    <HonorableMenuItem
+      ref={ref}
+      {...props}
+    />
+  )
+}
+
+const MenuItem = forwardRef(MenuItemRef)
+
+export default MenuItem
diff --git a/src/index.ts b/src/index.ts
index ad79887b..afa7d72a 100644
--- a/src/index.ts
+++ b/src/index.ts
@@ -1,4 +1,4 @@
-export { Avatar, Menu, MenuItem } from 'honorable'
+export { Avatar } from 'honorable'
 
 // Icons
 export * from './icons'
@@ -35,6 +35,8 @@ export { default as IconFrame } from './components/IconFrame'
 export { default as Input } from './components/Input'
 export { default as Input2 } from './components/Input2'
 export { default as Markdown } from './components/Markdown'
+export { default as Menu } from './components/Menu'
+export { default as MenuItem } from './components/MenuItem'
 export type { PageCardProps } from './components/PageCard'
 export { default as PageCard } from './components/PageCard'
 export { default as PageTitle } from './components/PageTitle'

From b9335bc8f326d09adbe0469dfe0faa95082116be Mon Sep 17 00:00:00 2001
From: Marcin Maciaszczyk <marcin@plural.sh>
Date: Fri, 4 Oct 2024 12:05:44 +0200
Subject: [PATCH 2/2] reduce spacing between icons in sidebar and add vertical
 padding

---
 src/components/SidebarItem.tsx    | 2 +-
 src/components/SidebarSection.tsx | 2 +-
 2 files changed, 2 insertions(+), 2 deletions(-)

diff --git a/src/components/SidebarItem.tsx b/src/components/SidebarItem.tsx
index af7c2023..201f3c7d 100644
--- a/src/components/SidebarItem.tsx
+++ b/src/components/SidebarItem.tsx
@@ -87,7 +87,7 @@ const ItemSC = styled.div<{
   textDecoration: 'none',
   whiteSpace: 'nowrap',
   width: $isHorizontal ? undefined : '100%',
-  height: $isHorizontal ? undefined : 32,
+  height: $isHorizontal ? undefined : 39,
   flexGrow: 0,
   padding: $isHorizontal ? undefined : theme.spacing.small,
   borderRadius: '3px',
diff --git a/src/components/SidebarSection.tsx b/src/components/SidebarSection.tsx
index 7b8cc9b9..59f98a15 100644
--- a/src/components/SidebarSection.tsx
+++ b/src/components/SidebarSection.tsx
@@ -27,7 +27,7 @@ function SidebarSectionRef(
       align="center"
       ref={ref}
       borderBottom={isHorizontal ? '' : '1px solid border'}
-      gap={isHorizontal ? 'medium' : 'xsmall'}
+      gap={isHorizontal ? 'medium' : 'xxsmall'}
       padding={12}
       width={isHorizontal ? 'auto' : '100%'}
       {...styles}