[@mantine/core] Popover: Fix styles prop being handled incorrectly (#…

…7120)
mantinedev · Nov 16, 2024 · bd40d73 · bd40d73
1 parent ed68c87
commit bd40d73
Show file tree

Hide file tree

Showing 3 changed files with 7 additions and 0 deletions.
diff --git a/packages/@mantine/core/src/components/Popover/Popover.context.ts b/packages/@mantine/core/src/components/Popover/Popover.context.ts
@@ -52,6 +52,7 @@ interface PopoverContext {
   variant: string | undefined;
   keepMounted: boolean | undefined;
   getStyles: GetStylesApi<PopoverFactory>;
+  resolvedStyles: Record<string, any>;
   floatingStrategy: FloatingStrategy | undefined;
 }
 

diff --git a/packages/@mantine/core/src/components/Popover/Popover.tsx b/packages/@mantine/core/src/components/Popover/Popover.tsx
@@ -12,6 +12,7 @@ import {
   StylesApiProps,
   useDirection,
   useProps,
+  useResolvedStylesApi,
   useStyles,
 } from '../../core';
 import {
@@ -232,6 +233,8 @@ export function Popover(_props: PopoverProps) {
     varsResolver,
   });
 
+  const { resolvedStyles } = useResolvedStylesApi<PopoverFactory>({ classNames, styles, props });
+
   const arrowRef = useRef<HTMLDivElement | null>(null);
   const [targetNode, setTargetNode] = useState<HTMLElement | null>(null);
   const [dropdownNode, setDropdownNode] = useState<HTMLElement | null>(null);
@@ -318,6 +321,7 @@ export function Popover(_props: PopoverProps) {
         variant,
         keepMounted,
         getStyles,
+        resolvedStyles,
         floatingStrategy,
       }}
     >

diff --git a/packages/@mantine/core/src/components/Popover/PopoverDropdown/PopoverDropdown.tsx b/packages/@mantine/core/src/components/Popover/PopoverDropdown/PopoverDropdown.tsx
@@ -108,6 +108,8 @@ export const PopoverDropdown = factory<PopoverDropdownFactory>((_props, ref) =>
                     left: ctx.x ?? 0,
                     width: ctx.width === 'target' ? undefined : rem(ctx.width),
                   },
+                  ctx.resolvedStyles.dropdown,
+                  styles?.dropdown,
                   style,
                 ],
               })}