diff --git a/blocks/block-edit/index.js b/blocks/block-edit/index.js index 7d497ba1217a34..97362d85c13087 100644 --- a/blocks/block-edit/index.js +++ b/blocks/block-edit/index.js @@ -15,8 +15,10 @@ function BlockEdit( props ) { // `edit` and `save` are functions or components describing the markup // with which a block is displayed. If `blockType` is valid, assign // them preferencially as the render value for the block. - const Edit = blockType.edit || blockType.save; - Edit.displayName = 'Edit'; + let Edit; + if ( blockType ) { + Edit = blockType.edit || blockType.save; + } return applyFilters( 'BlockEdit', , props ); } diff --git a/blocks/hooks/anchor.js b/blocks/hooks/anchor.js index 149431318c6e04..88a8bb275dd4a6 100644 --- a/blocks/hooks/anchor.js +++ b/blocks/hooks/anchor.js @@ -6,7 +6,6 @@ import { assign } from 'lodash'; /** * WordPress dependencies */ -import { concatChildren } from '@wordpress/element'; import { __ } from '@wordpress/i18n'; /** @@ -55,9 +54,9 @@ export function addAttribute( settings ) { */ export function addInspectorControl( element, props ) { if ( hasBlockSupport( props.name, 'anchor' ) && props.focus ) { - element = concatChildren( + element = [ element, - + - - ); + , + ]; } return element; diff --git a/blocks/hooks/custom-class-name.js b/blocks/hooks/custom-class-name.js index 2133197429c6f8..4cae9cd193e186 100644 --- a/blocks/hooks/custom-class-name.js +++ b/blocks/hooks/custom-class-name.js @@ -7,7 +7,6 @@ import classnames from 'classnames'; /** * WordPress dependencies */ -import { concatChildren } from '@wordpress/element'; import { __ } from '@wordpress/i18n'; /** @@ -46,9 +45,9 @@ export function addAttribute( settings ) { */ export function addInspectorControl( element, props ) { if ( hasBlockSupport( props.name, 'customClassName', true ) && props.focus ) { - element = concatChildren( + element = [ element, - + - - ); + , + ]; } return element; diff --git a/blocks/inspector-controls/index.js b/blocks/inspector-controls/index.js index 6b59c69af1fa9a..f5db4830647cac 100644 --- a/blocks/inspector-controls/index.js +++ b/blocks/inspector-controls/index.js @@ -15,9 +15,9 @@ import TextControl from './text-control'; import TextareaControl from './textarea-control'; import ToggleControl from './toggle-control'; -export default function InspectorControls( { force = false, children } ) { +export default function InspectorControls( { children } ) { return ( - + { children } ); diff --git a/components/slot-fill/fill.js b/components/slot-fill/fill.js index 45c7d15008199e..628e434bbf27d3 100644 --- a/components/slot-fill/fill.js +++ b/components/slot-fill/fill.js @@ -8,18 +8,25 @@ import { noop } from 'lodash'; */ import { Component, createPortal } from '@wordpress/element'; -/** - * Internal dependencies - */ -import withInstanceId from '../higher-order/with-instance-id'; +let occurrences = 0; class Fill extends Component { + componentWillMount() { + this.occurrence = ++occurrences; + } + componentDidMount() { const { registerFill = noop } = this.context; registerFill( this.props.name, this ); } + componentWillUpdate() { + if ( ! this.occurrence ) { + this.occurrence = ++occurrences; + } + } + componentWillUnmount() { const { unregisterFill = noop } = this.context; @@ -27,13 +34,13 @@ class Fill extends Component { } componentWillReceiveProps( nextProps ) { - const { name, force } = nextProps; + const { name } = nextProps; const { unregisterFill = noop, registerFill = noop, } = this.context; - if ( this.props.name !== name || force ) { + if ( this.props.name !== name ) { unregisterFill( this.props.name, this ); registerFill( name, this ); } @@ -47,6 +54,10 @@ class Fill extends Component { } } + resetOccurrence() { + this.occurrence = null; + } + render() { const { getSlot = noop } = this.context; const { name, children } = this.props; @@ -65,4 +76,4 @@ Fill.contextTypes = { unregisterFill: noop, }; -export default withInstanceId( Fill ); +export default Fill; diff --git a/components/slot-fill/provider.js b/components/slot-fill/provider.js index f746421e2986a0..55a3fa8be24424 100644 --- a/components/slot-fill/provider.js +++ b/components/slot-fill/provider.js @@ -1,7 +1,7 @@ /** * External dependencies */ -import { pick, without, noop } from 'lodash'; +import { pick, sortBy, forEach, without, noop } from 'lodash'; /** * WordPress dependencies @@ -61,6 +61,7 @@ class SlotFillProvider extends Component { this.fills[ name ], instance ); + this.resetFillOccurrence( name ); this.forceUpdateSlot( name ); } @@ -69,15 +70,19 @@ class SlotFillProvider extends Component { } getFills( name ) { - return this.fills[ name ]; + return sortBy( this.fills[ name ], 'occurrence' ); + } + + resetFillOccurrence( name ) { + forEach( this.fills[ name ], ( instance ) => { + instance.resetOccurrence(); + } ); } forceUpdateFills( name ) { - if ( this.fills.hasOwnProperty( name ) ) { - this.fills[ name ].forEach( ( instance ) => { - instance.forceUpdate(); - } ); - } + forEach( this.fills[ name ], ( instance ) => { + instance.forceUpdate(); + } ); } forceUpdateSlot( name ) { diff --git a/components/slot-fill/slot.js b/components/slot-fill/slot.js index 4214e41756ea83..8dc373509a1d16 100644 --- a/components/slot-fill/slot.js +++ b/components/slot-fill/slot.js @@ -55,7 +55,7 @@ class Slot extends Component { return (
{ map( getFills( name ), ( fill ) => { - const fillKey = fill.props.instanceId; + const fillKey = fill.occurrence; return Children.map( fill.props.children, ( child, childIndex ) => { if ( ! child || isString( child ) ) { return child; diff --git a/components/slot-fill/test/slot.js b/components/slot-fill/test/slot.js index a2253a3427bb18..95b60233758360 100644 --- a/components/slot-fill/test/slot.js +++ b/components/slot-fill/test/slot.js @@ -26,7 +26,7 @@ class Filler extends Component { render() { return [