Allow margin reset on inline popover via inline styles

WordPress · Aug 8, 2024 · 6c3b96a · 6c3b96a
1 parent 9e3b9ae
commit 6c3b96a
Show file tree

Hide file tree

Showing 3 changed files with 14 additions and 1 deletion.
diff --git a/packages/block-editor/src/components/grid/grid-visualizer.js b/packages/block-editor/src/components/grid/grid-visualizer.js
@@ -90,6 +90,7 @@ const GridVisualizerGrid = forwardRef(
 					'is-dropping-allowed': isDroppingAllowed,
 				} ) }
 				clientId={ gridClientId }
+				contentStyle={ { margin: 0 } }
 			>
 				<div
 					ref={ ref }

diff --git a/packages/components/src/popover/index.tsx b/packages/components/src/popover/index.tsx
@@ -139,6 +139,7 @@ const UnforwardedPopover = (
 		shift = false,
 		inline = false,
 		variant,
+		contentStyle,
 
 		// Deprecated props
 		__unstableForcePosition,
@@ -370,6 +371,7 @@ const UnforwardedPopover = (
 	const animationProps: HTMLMotionProps< 'div' > = shouldAnimate
 		? {
 				style: {
+					...contentStyle,
 					...motionInlineStyles,
 					...style,
 				},
@@ -378,7 +380,10 @@ const UnforwardedPopover = (
 		  }
 		: {
 				animate: false,
-				style,
+				style: {
+					...contentStyle,
+					...style,
+				},
 		  };
 
 	// When Floating UI has finished positioning and Framer Motion has finished animating

diff --git a/packages/components/src/popover/types.ts b/packages/components/src/popover/types.ts
@@ -160,6 +160,13 @@ export type PopoverProps = {
 	 * @default false
 	 */
 	inline?: boolean;
+	/**
+	 * Styles to apply to the main popover element.
+	 *
+	 * @default undefined
+	 */
+	contentStyle?: React.CSSProperties;
+
 	// Deprecated props
 	/**
 	 * Prevent the popover from flipping and resizing when meeting the viewport