From bac0b33714ec96dc5dcb566d5472433e1e368fda Mon Sep 17 00:00:00 2001 From: Jarda Snajdr Date: Wed, 26 Apr 2023 12:24:46 +0200 Subject: [PATCH 1/5] Fill: simplify component by using useContext --- packages/components/src/slot-fill/fill.js | 24 ++++++++--------------- 1 file changed, 8 insertions(+), 16 deletions(-) diff --git a/packages/components/src/slot-fill/fill.js b/packages/components/src/slot-fill/fill.js index 745439a275dd1e..0a7719e8a5b2d4 100644 --- a/packages/components/src/slot-fill/fill.js +++ b/packages/components/src/slot-fill/fill.js @@ -3,7 +3,12 @@ /** * WordPress dependencies */ -import { createPortal, useLayoutEffect, useRef } from '@wordpress/element'; +import { + createPortal, + useContext, + useLayoutEffect, + useRef, +} from '@wordpress/element'; /** * Internal dependencies @@ -11,7 +16,8 @@ import { createPortal, useLayoutEffect, useRef } from '@wordpress/element'; import SlotFillContext from './context'; import useSlot from './use-slot'; -function FillComponent( { name, children, registerFill, unregisterFill } ) { +export default function Fill( { name, children } ) { + const { registerFill, unregisterFill } = useContext( SlotFillContext ); const slot = useSlot( name ); const ref = useRef( { @@ -62,17 +68,3 @@ function FillComponent( { name, children, registerFill, unregisterFill } ) { return createPortal( children, slot.node ); } - -const Fill = ( props ) => ( - - { ( { registerFill, unregisterFill } ) => ( - - ) } - -); - -export default Fill; From 5aa1933c34ef07bfbff7246222bbc913ec87be60 Mon Sep 17 00:00:00 2001 From: Jarda Snajdr Date: Wed, 26 Apr 2023 12:33:55 +0200 Subject: [PATCH 2/5] SlotFillProvider: remove unused and unexposed hasFills method --- packages/components/src/slot-fill/provider.js | 6 ------ 1 file changed, 6 deletions(-) diff --git a/packages/components/src/slot-fill/provider.js b/packages/components/src/slot-fill/provider.js index 37b4560140516c..94c83c3c350111 100644 --- a/packages/components/src/slot-fill/provider.js +++ b/packages/components/src/slot-fill/provider.js @@ -19,7 +19,6 @@ export default class SlotFillProvider extends Component { this.unregisterFill = this.unregisterFill.bind( this ); this.getSlot = this.getSlot.bind( this ); this.getFills = this.getFills.bind( this ); - this.hasFills = this.hasFills.bind( this ); this.subscribe = this.subscribe.bind( this ); this.slots = {}; @@ -32,7 +31,6 @@ export default class SlotFillProvider extends Component { unregisterFill: this.unregisterFill, getSlot: this.getSlot, getFills: this.getFills, - hasFills: this.hasFills, subscribe: this.subscribe, }; } @@ -91,10 +89,6 @@ export default class SlotFillProvider extends Component { return this.fills[ name ]; } - hasFills( name ) { - return this.fills[ name ] && !! this.fills[ name ].length; - } - forceUpdateSlot( name ) { const slot = this.getSlot( name ); From c90c0c835253af5b2df5343eb15eb22bc40837e4 Mon Sep 17 00:00:00 2001 From: Jarda Snajdr Date: Wed, 26 Apr 2023 13:30:56 +0200 Subject: [PATCH 3/5] Slot: remove unused bindNode method --- packages/components/src/slot-fill/slot.js | 5 ----- 1 file changed, 5 deletions(-) diff --git a/packages/components/src/slot-fill/slot.js b/packages/components/src/slot-fill/slot.js index a314047600bd32..a960647c3ab64e 100644 --- a/packages/components/src/slot-fill/slot.js +++ b/packages/components/src/slot-fill/slot.js @@ -29,7 +29,6 @@ class SlotComponent extends Component { super( ...arguments ); this.isUnmounted = false; - this.bindNode = this.bindNode.bind( this ); } componentDidMount() { @@ -53,10 +52,6 @@ class SlotComponent extends Component { } } - bindNode( node ) { - this.node = node; - } - forceUpdate() { if ( this.isUnmounted ) { return; From d31a32b86a692988fa8d651a0ed1fc0c131531fc Mon Sep 17 00:00:00 2001 From: Jarda Snajdr Date: Wed, 26 Apr 2023 13:44:28 +0200 Subject: [PATCH 4/5] Fill: remove unused portal code (moved to bubblesVirtually version) --- packages/components/src/slot-fill/fill.js | 18 ++---------------- 1 file changed, 2 insertions(+), 16 deletions(-) diff --git a/packages/components/src/slot-fill/fill.js b/packages/components/src/slot-fill/fill.js index 0a7719e8a5b2d4..e7ff943df07bff 100644 --- a/packages/components/src/slot-fill/fill.js +++ b/packages/components/src/slot-fill/fill.js @@ -3,12 +3,7 @@ /** * WordPress dependencies */ -import { - createPortal, - useContext, - useLayoutEffect, - useRef, -} from '@wordpress/element'; +import { useContext, useLayoutEffect, useRef } from '@wordpress/element'; /** * Internal dependencies @@ -57,14 +52,5 @@ export default function Fill( { name, children } ) { // eslint-disable-next-line react-hooks/exhaustive-deps }, [ name ] ); - if ( ! slot || ! slot.node ) { - return null; - } - - // If a function is passed as a child, provide it with the fillProps. - if ( typeof children === 'function' ) { - children = children( slot.props.fillProps ); - } - - return createPortal( children, slot.node ); + return null; } From 79127f449e492e6cb4a38d473aef9edd4ebae364 Mon Sep 17 00:00:00 2001 From: Jarda Snajdr Date: Wed, 26 Apr 2023 14:03:54 +0200 Subject: [PATCH 5/5] Improve export of useSlot --- packages/components/src/slot-fill/index.js | 4 +--- 1 file changed, 1 insertion(+), 3 deletions(-) diff --git a/packages/components/src/slot-fill/index.js b/packages/components/src/slot-fill/index.js index 24e68aa8877044..8deaa180492a7f 100644 --- a/packages/components/src/slot-fill/index.js +++ b/packages/components/src/slot-fill/index.js @@ -13,7 +13,7 @@ import BubblesVirtuallyFill from './bubbles-virtually/fill'; import BubblesVirtuallySlot from './bubbles-virtually/slot'; import BubblesVirtuallySlotFillProvider from './bubbles-virtually/slot-fill-provider'; import SlotFillProvider from './provider'; -import useSlot from './bubbles-virtually/use-slot'; +export { default as useSlot } from './bubbles-virtually/use-slot'; export { default as useSlotFills } from './bubbles-virtually/use-slot-fills'; export function Fill( props ) { @@ -65,5 +65,3 @@ export const createPrivateSlotFill = ( name ) => { return { privateKey, ...privateSlotFill }; }; - -export { useSlot };