From 7a41cad8a483bbb7b11a7f1d79d0e0ade54afc52 Mon Sep 17 00:00:00 2001
From: Mattias Andersson <mattias800@gmail.com>
Date: Thu, 19 Sep 2024 11:23:00 +0200
Subject: [PATCH] - Add zIndex and appendTo to ActionMenuButton components.

---
 .../action-menu-button/ActionMenuButton.tsx        | 14 +++++++++++++-
 1 file changed, 13 insertions(+), 1 deletion(-)

diff --git a/packages/panels/src/components/action-menu-button/ActionMenuButton.tsx b/packages/panels/src/components/action-menu-button/ActionMenuButton.tsx
index 0cc0140e2..7e0605e1c 100644
--- a/packages/panels/src/components/action-menu-button/ActionMenuButton.tsx
+++ b/packages/panels/src/components/action-menu-button/ActionMenuButton.tsx
@@ -11,7 +11,11 @@ import {
   stenaAngleDown,
 } from "@stenajs-webui/elements";
 import { useBoolean } from "@stenajs-webui/core";
-import { ControlledPopover, PopoverProps } from "@stenajs-webui/tooltip";
+import {
+  ControlledPopover,
+  ControlledPopoverProps,
+  PopoverProps,
+} from "@stenajs-webui/tooltip";
 
 export interface ActionMenuButtonProps
   extends Omit<
@@ -22,6 +26,10 @@ export interface ActionMenuButtonProps
   renderItems: (close: () => void) => ReactNode;
   /** The placement of the Action Menu. */
   placement?: PopoverProps["placement"];
+  /**  Z-index of the Action Menu */
+  zIndex?: number;
+  /** Portal target, HTML element. If not set, portal is not used. */
+  appendTo?: ControlledPopoverProps["appendTo"];
   menuWidth?: ActionMenuProps["width"];
   menuTop?: ActionMenuProps["top"];
   buttonComponent:
@@ -42,6 +50,8 @@ export const ActionMenuButton: React.FC<ActionMenuButtonProps> = ({
   onClick,
   disableArrow = false,
   buttonRef,
+  appendTo,
+  zIndex,
   ...buttonProps
 }) => {
   const [isOpen, open, close, toggle] = useBoolean(false);
@@ -75,6 +85,8 @@ export const ActionMenuButton: React.FC<ActionMenuButtonProps> = ({
         open={isOpen}
         onRequestClose={close}
         placement={placement}
+        appendTo={appendTo}
+        zIndex={zIndex}
       >
         {isOpen && (
           <ActionMenu width={menuWidth} top={menuTop} trapFocus>