From b5f950ef67ba7aed4c577daa485ae4ce695bab02 Mon Sep 17 00:00:00 2001
From: Eldar <61377022+EldarMuhamethanov@users.noreply.github.com>
Date: Tue, 17 Dec 2024 15:37:40 +0300
Subject: [PATCH] fix(Popper): add support of prop zIndex (#8091)

* feat(Popper): add support of prop zIndex

* fix(Popper): make with mergeStyle
---
 packages/vkui/src/components/Popper/Popper.tsx | 11 +++++++++++
 1 file changed, 11 insertions(+)

diff --git a/packages/vkui/src/components/Popper/Popper.tsx b/packages/vkui/src/components/Popper/Popper.tsx
index 6d8eaa86c0..128cd7d5ab 100644
--- a/packages/vkui/src/components/Popper/Popper.tsx
+++ b/packages/vkui/src/components/Popper/Popper.tsx
@@ -1,6 +1,7 @@
 'use client';
 
 import * as React from 'react';
+import { mergeStyle } from '../../helpers/mergeStyle';
 import { useExternRef } from '../../hooks/useExternRef';
 import {
   autoUpdateFloatingElement,
@@ -113,6 +114,8 @@ export const Popper = ({
   children,
   usePortal = true,
   onPlacementChange,
+  zIndex,
+  style,
   ...restProps
 }: PopperProps): React.ReactNode => {
   const [arrowRef, setArrowRef] = React.useState<HTMLDivElement | null>(null);
@@ -159,9 +162,17 @@ export const Popper = ({
     refs.setReference('current' in targetRef ? targetRef.current : targetRef);
   }, [refs.setReference, targetRef]);
 
+  const dropdownStyle =
+    typeof zIndex !== 'undefined'
+      ? {
+          zIndex,
+        }
+      : undefined;
+
   const dropdown = (
     <RootComponent
       {...restProps}
+      style={mergeStyle(dropdownStyle, style)}
       baseClassName={styles.host}
       getRootRef={handleRootRef}
       baseStyle={convertFloatingDataToReactCSSProperties(