SlotFill: Allow contextual SlotFillProviders

WordPress · Dec 5, 2023 · 7627ff3 · 7627ff3
1 parent 308fc42
commit 7627ff3
Show file tree

Hide file tree

Showing 3 changed files with 11 additions and 3 deletions.
diff --git a/packages/block-editor/src/components/provider/index.js b/packages/block-editor/src/components/provider/index.js
@@ -45,7 +45,7 @@ export const ExperimentalBlockEditorProvider = withRegistryProvider(
 		useBlockSync( props );
 
 		return (
-			<SlotFillProvider>
+			<SlotFillProvider passthrough>
 				<KeyboardShortcuts.Register />
 				<BlockRefsProvider>{ children }</BlockRefsProvider>
 			</SlotFillProvider>

diff --git a/packages/components/src/slot-fill/index.tsx b/packages/components/src/slot-fill/index.tsx
@@ -55,9 +55,12 @@ export function UnforwardedSlot(
 }
 export const Slot = forwardRef( UnforwardedSlot );
 
-export function Provider( { children }: SlotFillProviderProps ) {
+export function Provider( {
+	children,
+	passthrough = false,
+}: SlotFillProviderProps ) {
 	const parent = useContext( SlotFillContext );
-	if ( ! parent.isDefault ) {
+	if ( ! parent.isDefault && passthrough ) {
 		return <>{ children }</>;
 	}
 	return (

diff --git a/packages/components/src/slot-fill/types.ts b/packages/components/src/slot-fill/types.ts
@@ -96,6 +96,11 @@ export type SlotFillProviderProps = {
 	 * The children elements.
 	 */
 	children: ReactNode;
+
+	/**
+	 * Whether to pass slots to the parent provider if existent.
+	 */
+	passthrough?: boolean;
 };
 
 export type SlotFillBubblesVirtuallySlotRef = RefObject< HTMLElement >;