chore(DropdownMenu): use Portal component from @headlessui/react

sikka-software · May 21, 2024 · 77b3ff2 · 77b3ff2
1 parent aa4f81f
commit 77b3ff2
Show file tree

Hide file tree

Showing 8 changed files with 171 additions and 9 deletions.
diff --git a/apps/docs/CHANGELOG.md b/apps/docs/CHANGELOG.md
@@ -1,5 +1,12 @@
 # hawa-docs
 
+## 0.0.68
+
+### Patch Changes
+
+- Updated dependencies
+  - @sikka/hawa@0.35.4
+
 ## 0.0.67
 
 ### Patch Changes

diff --git a/apps/docs/package.json b/apps/docs/package.json
@@ -1,6 +1,6 @@
 {
   "name": "hawa-docs",
-  "version": "0.0.67",
+  "version": "0.0.68",
   "private": true,
   "scripts": {
     "dev": "next dev -p 3001",

diff --git a/packages/components/CHANGELOG.md b/packages/components/CHANGELOG.md
@@ -1,5 +1,11 @@
 # @sikka/hawa
 
+## 0.35.4
+
+### Patch Changes
+
+- Use the `Portal` component from `@headlessui/react` in `DropdownMenu`
+
 ## 0.35.3
 
 ### Patch Changes

diff --git a/packages/components/elements/dropdownMenu/DropdownMenu.tsx b/packages/components/elements/dropdownMenu/DropdownMenu.tsx
@@ -1,10 +1,13 @@
 import * as React from "react";
 
+import { Portal } from "@headlessui/react";
 import * as DropdownMenuPrimitive from "@radix-ui/react-dropdown-menu";
 import { cn } from "@util/index";
 
 import { DirectionType, RadioOptionType } from "../../types/commonTypes";
 
+// New import
+
 const DropdownMenuRoot = DropdownMenuPrimitive.Root;
 const DropdownMenuTrigger = DropdownMenuPrimitive.Trigger;
 const DropdownMenuGroup = DropdownMenuPrimitive.Group;
@@ -70,7 +73,7 @@ const DropdownMenuContent = React.forwardRef<
   React.ElementRef<typeof DropdownMenuPrimitive.Content>,
   React.ComponentPropsWithoutRef<typeof DropdownMenuPrimitive.Content>
 >(({ className, sideOffset = 4, ...props }, ref) => (
-  <DropdownMenuPrimitive.Portal>
+  <Portal>
     <DropdownMenuPrimitive.Content
       ref={ref}
       sideOffset={sideOffset}
@@ -80,7 +83,7 @@ const DropdownMenuContent = React.forwardRef<
       )}
       {...props}
     />
-  </DropdownMenuPrimitive.Portal>
+  </Portal>
 ));
 DropdownMenuContent.displayName = DropdownMenuPrimitive.Content.displayName;
 
@@ -355,7 +358,7 @@ const DropdownMenu: React.FC<DropdownMenuProps> = ({
       >
         {trigger}
       </DropdownMenuTrigger>
-      <DropdownMenuPortal>
+      <Portal>
         <DropdownMenuContent
           side={side}
           sideOffset={sideOffset}
@@ -427,7 +430,7 @@ const DropdownMenu: React.FC<DropdownMenuProps> = ({
                       {item.icon && item.icon}
                       {item.label && item.label}
                     </DropdownMenuSubTrigger>
-                    <DropdownMenuPortal>
+                    <Portal>
                       <DropdownMenuSubContent>
                         {item.subitems.map((subitem, subIndex) => {
                           const SubitemLinkComponent = subitem.slug
@@ -469,7 +472,7 @@ const DropdownMenu: React.FC<DropdownMenuProps> = ({
                           );
                         })}
                       </DropdownMenuSubContent>
-                    </DropdownMenuPortal>
+                    </Portal>
                   </DropdownMenuSub>
                 ) : (
                   <DropdownMenuItem
@@ -526,7 +529,7 @@ const DropdownMenu: React.FC<DropdownMenuProps> = ({
               }
             })}
         </DropdownMenuContent>
-      </DropdownMenuPortal>
+      </Portal>
     </DropdownMenuRoot>
   );
 };

diff --git a/packages/components/package.json b/packages/components/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@sikka/hawa",
-  "version": "0.35.3",
+  "version": "0.35.4",
   "description": "Modern UI Kit made with Tailwind",
   "author": {
     "name": "Sikka Software",
@@ -57,6 +57,7 @@
     "react-dom": "18.3.1"
   },
   "dependencies": {
+    "@headlessui/react": "^2.0.3",
     "@hookform/resolvers": "^3.4.0",
     "@radix-ui/react-accordion": "^1.1.2",
     "@radix-ui/react-checkbox": "^1.0.4",

diff --git a/packages/storybook/CHANGELOG.md b/packages/storybook/CHANGELOG.md
@@ -1,5 +1,12 @@
 # hawa-storybook
 
+## 0.26.89
+
+### Patch Changes
+
+- Updated dependencies
+  - @sikka/hawa@0.35.4
+
 ## 0.26.88
 
 ### Patch Changes

diff --git a/packages/storybook/package.json b/packages/storybook/package.json
@@ -1,6 +1,6 @@
 {
   "name": "hawa-storybook",
-  "version": "0.26.88",
+  "version": "0.26.89",
   "description": "Modern UI Kit made with Tailwind",
   "author": {
     "name": "Sikka Software",

diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml