From c416eddf1890777d1520c7829615bd034806c40f Mon Sep 17 00:00:00 2001 From: ntsekouras Date: Wed, 18 Nov 2020 12:43:25 +0200 Subject: [PATCH 1/8] rough implementation --- .../src/post-featured-image/style.scss | 4 +++ .../block-library/src/query-loop/block.json | 3 ++- packages/block-library/src/query-loop/edit.js | 12 ++++++++- .../block-library/src/query-loop/index.php | 18 ++++++++++++- packages/block-library/src/query-loop/save.js | 6 ++++- .../block-library/src/query-loop/style.scss | 17 ++++++++++++ packages/block-library/src/query/block.json | 10 ++++++- .../block-library/src/query/edit/index.js | 11 ++++++-- .../query/edit/query-inspector-controls.js | 27 ++++++++++++++++++- packages/block-library/src/style.scss | 1 + 10 files changed, 101 insertions(+), 8 deletions(-) create mode 100644 packages/block-library/src/query-loop/style.scss diff --git a/packages/block-library/src/post-featured-image/style.scss b/packages/block-library/src/post-featured-image/style.scss index eaa2b5f413733..1deddff9a9fec 100644 --- a/packages/block-library/src/post-featured-image/style.scss +++ b/packages/block-library/src/post-featured-image/style.scss @@ -2,4 +2,8 @@ a { display: inline-block; } + img { + max-width: 100%; + height: auto; + } } diff --git a/packages/block-library/src/query-loop/block.json b/packages/block-library/src/query-loop/block.json index 963afbe71c630..5373403ea79a5 100644 --- a/packages/block-library/src/query-loop/block.json +++ b/packages/block-library/src/query-loop/block.json @@ -5,7 +5,8 @@ "usesContext": [ "queryId", "query", - "queryContext" + "queryContext", + "layout" ], "supports": { "reusable": false, diff --git a/packages/block-library/src/query-loop/edit.js b/packages/block-library/src/query-loop/edit.js index a87b8b33ca13d..6b0b978c3b49c 100644 --- a/packages/block-library/src/query-loop/edit.js +++ b/packages/block-library/src/query-loop/edit.js @@ -1,3 +1,8 @@ +/** + * External dependencies + */ +import classnames from 'classnames'; + /** * WordPress dependencies */ @@ -38,6 +43,7 @@ export default function QueryLoopEdit( { sticky, } = {}, queryContext, + layout: { columns = 1 } = {}, }, } ) { const [ { page } ] = useQueryContext() || queryContext || [ {} ]; @@ -102,7 +108,11 @@ export default function QueryLoopEdit( { } ) ), [ posts ] ); - const blockProps = useBlockProps(); + const blockProps = useBlockProps( { + className: classnames( `columns-${ columns }`, { + 'is-grid': columns > 1, + } ), + } ); const innerBlocksProps = useInnerBlocksProps( {}, { template: TEMPLATE } ); if ( ! posts ) { diff --git a/packages/block-library/src/query-loop/index.php b/packages/block-library/src/query-loop/index.php index 5acc340bd66e2..c735b3d5f7dbf 100644 --- a/packages/block-library/src/query-loop/index.php +++ b/packages/block-library/src/query-loop/index.php @@ -69,6 +69,18 @@ function render_block_core_query_loop( $attributes, $content, $block ) { $posts = get_posts( $query ); + $classnames = ''; + if ( isset( $block->context['layout'] ) && isset( $block->context['query'] ) ) { + if ( isset( $block->context['layout']['type'] ) && $block->context['layout']['type'] === 'flex' ) { + $columns = $block->context['layout']['columns']; + if ( $columns > 1 ) { + $classnames = "is-grid columns-{$columns}"; + } + } + } + + $wrapper_attributes = get_block_wrapper_attributes( array( 'class' => $classnames ) ); + $content = ''; foreach ( $posts as $post ) { $content .= ( @@ -81,7 +93,11 @@ function render_block_core_query_loop( $attributes, $content, $block ) { ) )->render( array( 'dynamic' => false ) ); } - return $content; + return sprintf( + '
%2$s
', + $wrapper_attributes, + $content + ); } /** diff --git a/packages/block-library/src/query-loop/save.js b/packages/block-library/src/query-loop/save.js index 25c0128386512..4871868c48f7f 100644 --- a/packages/block-library/src/query-loop/save.js +++ b/packages/block-library/src/query-loop/save.js @@ -4,5 +4,9 @@ import { InnerBlocks } from '@wordpress/block-editor'; export default function QueryLoopSave() { - return ; + return ( +
+ +
+ ); } diff --git a/packages/block-library/src/query-loop/style.scss b/packages/block-library/src/query-loop/style.scss new file mode 100644 index 0000000000000..8037885c18d5a --- /dev/null +++ b/packages/block-library/src/query-loop/style.scss @@ -0,0 +1,17 @@ +.wp-block-query-loop { + max-width: 100%; + display: flex; + flex-wrap: wrap; + flex-direction: column; + + &.is-grid { + flex-direction: row; + } + @include break-small { + @for $i from 2 through 6 { + &.is-grid.columns-#{ $i } > div { + width: calc((100% / #{$i}) - 1em); + } + } + } +} diff --git a/packages/block-library/src/query/block.json b/packages/block-library/src/query/block.json index f01c6b66081e3..012ef523adc4b 100644 --- a/packages/block-library/src/query/block.json +++ b/packages/block-library/src/query/block.json @@ -22,11 +22,19 @@ "exclude": [], "sticky": "" } + }, + "layout": { + "type": "object", + "default": { + "type": "flex", + "columns": 1 + } } }, "providesContext": { "queryId": "queryId", - "query": "query" + "query": "query", + "layout": "layout" }, "usesContext": [ "postId" diff --git a/packages/block-library/src/query/edit/index.js b/packages/block-library/src/query/edit/index.js index 40b9cc4ab755d..d0194016b699d 100644 --- a/packages/block-library/src/query/edit/index.js +++ b/packages/block-library/src/query/edit/index.js @@ -21,10 +21,11 @@ import { DEFAULTS_POSTS_PER_PAGE } from '../constants'; const TEMPLATE = [ [ 'core/query-loop' ] ]; export function QueryContent( { - attributes: { queryId, query }, + attributes, context: { postId }, setAttributes, } ) { + const { queryId, query, layout } = attributes; const instanceId = useInstanceId( QueryContent ); const blockProps = useBlockProps(); const innerBlocksProps = useInnerBlocksProps( {}, { template: TEMPLATE } ); @@ -59,9 +60,15 @@ export function QueryContent( { }, [ queryId, instanceId ] ); const updateQuery = ( newQuery ) => setAttributes( { query: { ...query, ...newQuery } } ); + const updateLayout = ( newLayout ) => + setAttributes( { layout: { ...layout, ...newLayout } } ); return ( <> - + diff --git a/packages/block-library/src/query/edit/query-inspector-controls.js b/packages/block-library/src/query/edit/query-inspector-controls.js index a558884ca1f91..da84ddc7ad4dd 100644 --- a/packages/block-library/src/query/edit/query-inspector-controls.js +++ b/packages/block-library/src/query/edit/query-inspector-controls.js @@ -13,6 +13,8 @@ import { TextControl, FormTokenField, SelectControl, + RangeControl, + Notice, } from '@wordpress/components'; import { __ } from '@wordpress/i18n'; import { InspectorControls } from '@wordpress/block-editor'; @@ -31,7 +33,14 @@ const stickyOptions = [ { label: __( 'Only' ), value: 'only' }, ]; -export default function QueryInspectorControls( { query, setQuery } ) { +export default function QueryInspectorControls( { + attributes: { + query, + layout: { columns }, + }, + setQuery, + setLayout, +} ) { const { order, orderBy, @@ -132,6 +141,22 @@ export default function QueryInspectorControls( { query, setQuery } ) { }, [ querySearch, onChangeDebounced ] ); return ( + + setLayout( { columns: value } ) } + min={ 1 } + max={ Math.max( 6, columns ) } + /> + { columns > 6 && ( + + { __( + 'This column count exceeds the recommended amount and may cause visual breakage.' + ) } + + ) } + Date: Wed, 18 Nov 2020 14:58:40 +0200 Subject: [PATCH 2/8] style with grid Co-authored-by: Ari Stathopoulos --- packages/block-library/src/query-loop/style.scss | 12 ++++-------- 1 file changed, 4 insertions(+), 8 deletions(-) diff --git a/packages/block-library/src/query-loop/style.scss b/packages/block-library/src/query-loop/style.scss index 8037885c18d5a..53a8291372ba2 100644 --- a/packages/block-library/src/query-loop/style.scss +++ b/packages/block-library/src/query-loop/style.scss @@ -1,16 +1,12 @@ .wp-block-query-loop { max-width: 100%; - display: flex; - flex-wrap: wrap; - flex-direction: column; + display: grid; + grid-gap: 1em; - &.is-grid { - flex-direction: row; - } @include break-small { @for $i from 2 through 6 { - &.is-grid.columns-#{ $i } > div { - width: calc((100% / #{$i}) - 1em); + &.is-grid.columns-#{ $i } { + grid-template-columns: repeat(#{ $i }, 1fr); } } } From 9962e8b1d52bdc674c5a7e08986407ab7e190f02 Mon Sep 17 00:00:00 2001 From: ntsekouras Date: Thu, 19 Nov 2020 17:00:50 +0200 Subject: [PATCH 3/8] revert to flex --- packages/block-library/src/query-loop/edit.js | 8 +++++--- packages/block-library/src/query-loop/index.php | 2 +- packages/block-library/src/query-loop/style.scss | 16 ++++++++++------ 3 files changed, 16 insertions(+), 10 deletions(-) diff --git a/packages/block-library/src/query-loop/edit.js b/packages/block-library/src/query-loop/edit.js index 6b0b978c3b49c..056a21141a62a 100644 --- a/packages/block-library/src/query-loop/edit.js +++ b/packages/block-library/src/query-loop/edit.js @@ -43,7 +43,7 @@ export default function QueryLoopEdit( { sticky, } = {}, queryContext, - layout: { columns = 1 } = {}, + layout: { type: layoutType = 'flex', columns = 1 } = {}, }, } ) { const [ { page } ] = useQueryContext() || queryContext || [ {} ]; @@ -108,9 +108,11 @@ export default function QueryLoopEdit( { } ) ), [ posts ] ); + const hasLayoutFlex = layoutType === 'flex' && columns > 1; const blockProps = useBlockProps( { - className: classnames( `columns-${ columns }`, { - 'is-grid': columns > 1, + className: classnames( { + 'is-flex-container': hasLayoutFlex, + [ `columns-${ columns }` ]: hasLayoutFlex, } ), } ); const innerBlocksProps = useInnerBlocksProps( {}, { template: TEMPLATE } ); diff --git a/packages/block-library/src/query-loop/index.php b/packages/block-library/src/query-loop/index.php index c735b3d5f7dbf..df684425ab031 100644 --- a/packages/block-library/src/query-loop/index.php +++ b/packages/block-library/src/query-loop/index.php @@ -74,7 +74,7 @@ function render_block_core_query_loop( $attributes, $content, $block ) { if ( isset( $block->context['layout']['type'] ) && $block->context['layout']['type'] === 'flex' ) { $columns = $block->context['layout']['columns']; if ( $columns > 1 ) { - $classnames = "is-grid columns-{$columns}"; + $classnames = "is-flex-container columns-{$columns}"; } } } diff --git a/packages/block-library/src/query-loop/style.scss b/packages/block-library/src/query-loop/style.scss index 53a8291372ba2..94bd5a4eb723e 100644 --- a/packages/block-library/src/query-loop/style.scss +++ b/packages/block-library/src/query-loop/style.scss @@ -1,12 +1,16 @@ .wp-block-query-loop { max-width: 100%; - display: grid; - grid-gap: 1em; - @include break-small { - @for $i from 2 through 6 { - &.is-grid.columns-#{ $i } { - grid-template-columns: repeat(#{ $i }, 1fr); + &.is-flex-container { + flex-direction: row; + display: flex; + flex-wrap: wrap; + + @include break-small { + @for $i from 2 through 6 { + &.is-flex-container.columns-#{ $i } > div { + width: calc((100% / #{$i})); + } } } } From f23373448f68cd34fc007f68ed70fe531963da99 Mon Sep 17 00:00:00 2001 From: ntsekouras Date: Thu, 19 Nov 2020 17:42:57 +0200 Subject: [PATCH 4/8] toolbar controls --- .../block-library/src/query-loop/index.php | 5 +- packages/block-library/src/query/block.json | 3 +- .../block-library/src/query/edit/index.js | 6 +- .../query/edit/query-inspector-controls.js | 41 ++--- .../src/query/edit/query-toolbar.js | 140 ++++++++++-------- 5 files changed, 109 insertions(+), 86 deletions(-) diff --git a/packages/block-library/src/query-loop/index.php b/packages/block-library/src/query-loop/index.php index df684425ab031..cce6d6ae4ea06 100644 --- a/packages/block-library/src/query-loop/index.php +++ b/packages/block-library/src/query-loop/index.php @@ -72,10 +72,7 @@ function render_block_core_query_loop( $attributes, $content, $block ) { $classnames = ''; if ( isset( $block->context['layout'] ) && isset( $block->context['query'] ) ) { if ( isset( $block->context['layout']['type'] ) && $block->context['layout']['type'] === 'flex' ) { - $columns = $block->context['layout']['columns']; - if ( $columns > 1 ) { - $classnames = "is-flex-container columns-{$columns}"; - } + $classnames = "is-flex-container columns-{$block->context['layout']['columns']}"; } } diff --git a/packages/block-library/src/query/block.json b/packages/block-library/src/query/block.json index 012ef523adc4b..7477e03d6f848 100644 --- a/packages/block-library/src/query/block.json +++ b/packages/block-library/src/query/block.json @@ -26,8 +26,7 @@ "layout": { "type": "object", "default": { - "type": "flex", - "columns": 1 + "type": "list" } } }, diff --git a/packages/block-library/src/query/edit/index.js b/packages/block-library/src/query/edit/index.js index d0194016b699d..45be4c7f88537 100644 --- a/packages/block-library/src/query/edit/index.js +++ b/packages/block-library/src/query/edit/index.js @@ -70,7 +70,11 @@ export function QueryContent( { setLayout={ updateLayout } /> - +
diff --git a/packages/block-library/src/query/edit/query-inspector-controls.js b/packages/block-library/src/query/edit/query-inspector-controls.js index da84ddc7ad4dd..c0c57d4d595ce 100644 --- a/packages/block-library/src/query/edit/query-inspector-controls.js +++ b/packages/block-library/src/query/edit/query-inspector-controls.js @@ -34,10 +34,7 @@ const stickyOptions = [ ]; export default function QueryInspectorControls( { - attributes: { - query, - layout: { columns }, - }, + attributes: { query, layout }, setQuery, setLayout, } ) { @@ -141,22 +138,26 @@ export default function QueryInspectorControls( { }, [ querySearch, onChangeDebounced ] ); return ( - - setLayout( { columns: value } ) } - min={ 1 } - max={ Math.max( 6, columns ) } - /> - { columns > 6 && ( - - { __( - 'This column count exceeds the recommended amount and may cause visual breakage.' - ) } - - ) } - + { layout?.type === 'flex' && ( + + + setLayout( { columns: value } ) + } + min={ 1 } + max={ Math.max( 6, layout.columns ) } + /> + { layout.columns > 6 && ( + + { __( + 'This column count exceeds the recommended amount and may cause visual breakage.' + ) } + + ) } + + ) } setLayout( { type: 'list' } ), + isActive: layout?.type === 'list', + }, + { + icon: grid, + title: __( 'Grid view' ), + onClick: () => + setLayout( { type: 'flex', columns: layout?.columns || 3 } ), + isActive: layout?.type === 'flex', + }, + ]; return ( - - ( - - ) } - renderContent={ () => ( - <> - - - setQuery( { perPage: +value ?? -1 } ) - } - step="1" - value={ query.perPage } - isDragEnabled={ false } - /> - - - - setQuery( { offset: +value } ) - } - step="1" - value={ query.offset } - isDragEnabled={ false } - /> - - - - setQuery( { pages: value ?? -1 } ) - } - /> - - - ) } - /> - + <> + + ( + + ) } + renderContent={ () => ( + <> + + + setQuery( { perPage: +value ?? -1 } ) + } + step="1" + value={ query.perPage } + isDragEnabled={ false } + /> + + + + setQuery( { offset: +value } ) + } + step="1" + value={ query.offset } + isDragEnabled={ false } + /> + + + + setQuery( { pages: value ?? -1 } ) + } + /> + + + ) } + /> + + + ); } From 940e97e7822213424870cdbad3c3ea4bed1f75df Mon Sep 17 00:00:00 2001 From: ntsekouras Date: Fri, 20 Nov 2020 11:46:13 +0200 Subject: [PATCH 5/8] polish grid view + change to
    --- packages/block-library/src/query-loop/edit.js | 22 +++++----- .../block-library/src/query-loop/editor.scss | 4 +- .../block-library/src/query-loop/index.php | 2 +- packages/block-library/src/query-loop/save.js | 4 +- .../block-library/src/query-loop/style.scss | 19 ++++++++- .../query/edit/query-inspector-controls.js | 40 +++++++++---------- 6 files changed, 55 insertions(+), 36 deletions(-) diff --git a/packages/block-library/src/query-loop/edit.js b/packages/block-library/src/query-loop/edit.js index 056a21141a62a..a32ffd6741050 100644 --- a/packages/block-library/src/query-loop/edit.js +++ b/packages/block-library/src/query-loop/edit.js @@ -126,7 +126,7 @@ export default function QueryLoopEdit( { } return ( -
    +
      { blockContexts && blockContexts.map( ( blockContext ) => ( { blockContext === ( activeBlockContext || blockContexts[ 0 ] ) ? ( -
      +
    • ) : ( - - setActiveBlockContext( blockContext ) - } - /> +
    • + + setActiveBlockContext( blockContext ) + } + /> +
      • ) } ) ) } -
      +
    ); } diff --git a/packages/block-library/src/query-loop/editor.scss b/packages/block-library/src/query-loop/editor.scss index 294eb615109be..39a614277d58d 100644 --- a/packages/block-library/src/query-loop/editor.scss +++ b/packages/block-library/src/query-loop/editor.scss @@ -1,3 +1,5 @@ -.editor-styles-wrapper .wp-block.wp-block-query-loop { +.wp-block.wp-block-query-loop { max-width: 100%; + padding-left: 0; + list-style: none; } diff --git a/packages/block-library/src/query-loop/index.php b/packages/block-library/src/query-loop/index.php index cce6d6ae4ea06..1068616c1153c 100644 --- a/packages/block-library/src/query-loop/index.php +++ b/packages/block-library/src/query-loop/index.php @@ -91,7 +91,7 @@ function render_block_core_query_loop( $attributes, $content, $block ) { )->render( array( 'dynamic' => false ) ); } return sprintf( - '
    %2$s
    ', + '
      %2$s
    ', $wrapper_attributes, $content ); diff --git a/packages/block-library/src/query-loop/save.js b/packages/block-library/src/query-loop/save.js index 4871868c48f7f..a2afa4dff9b84 100644 --- a/packages/block-library/src/query-loop/save.js +++ b/packages/block-library/src/query-loop/save.js @@ -5,8 +5,8 @@ import { InnerBlocks } from '@wordpress/block-editor'; export default function QueryLoopSave() { return ( -
    +
  • -
    • + ); } diff --git a/packages/block-library/src/query-loop/style.scss b/packages/block-library/src/query-loop/style.scss index 94bd5a4eb723e..40413f4041a27 100644 --- a/packages/block-library/src/query-loop/style.scss +++ b/packages/block-library/src/query-loop/style.scss @@ -1,15 +1,30 @@ .wp-block-query-loop { max-width: 100%; + list-style: none; + padding: 0; + + li { + clear: both; + } &.is-flex-container { flex-direction: row; display: flex; flex-wrap: wrap; + li { + margin: 0 1.25em 1.25em 0; + width: 100%; + } + @include break-small { @for $i from 2 through 6 { - &.is-flex-container.columns-#{ $i } > div { - width: calc((100% / #{$i})); + &.is-flex-container.columns-#{ $i } > li { + width: calc((100% / #{ $i }) - 1.25em + (1.25em / #{ $i })); + + &:nth-child( #{ $i }n ) { + margin-right: 0; + } } } } diff --git a/packages/block-library/src/query/edit/query-inspector-controls.js b/packages/block-library/src/query/edit/query-inspector-controls.js index c0c57d4d595ce..1af29aa259daa 100644 --- a/packages/block-library/src/query/edit/query-inspector-controls.js +++ b/packages/block-library/src/query/edit/query-inspector-controls.js @@ -138,26 +138,6 @@ export default function QueryInspectorControls( { }, [ querySearch, onChangeDebounced ] ); return ( - { layout?.type === 'flex' && ( - - - setLayout( { columns: value } ) - } - min={ 1 } - max={ Math.max( 6, layout.columns ) } - /> - { layout.columns > 6 && ( - - { __( - 'This column count exceeds the recommended amount and may cause visual breakage.' - ) } - - ) } - - ) } + { layout?.type === 'flex' && ( + <> + + setLayout( { columns: value } ) + } + min={ 1 } + max={ Math.max( 6, layout.columns ) } + /> + { layout.columns > 6 && ( + + { __( + 'This column count exceeds the recommended amount and may cause visual breakage.' + ) } + + ) } + + ) } setQuery( { order: value } ) } From 37a1eee762613eb375a9b28fd5161b13fd4150b1 Mon Sep 17 00:00:00 2001 From: ntsekouras Date: Fri, 20 Nov 2020 12:05:33 +0200 Subject: [PATCH 6/8] regenerate fixtures for query+loop --- packages/e2e-tests/fixtures/blocks/core__query-loop.html | 2 +- packages/e2e-tests/fixtures/blocks/core__query-loop.json | 2 +- .../e2e-tests/fixtures/blocks/core__query-loop.parsed.json | 6 ++++-- .../fixtures/blocks/core__query-loop.serialized.html | 4 +++- packages/e2e-tests/fixtures/blocks/core__query.json | 3 +++ 5 files changed, 12 insertions(+), 5 deletions(-) diff --git a/packages/e2e-tests/fixtures/blocks/core__query-loop.html b/packages/e2e-tests/fixtures/blocks/core__query-loop.html index 16de7db3703b0..16143f110d4e4 100644 --- a/packages/e2e-tests/fixtures/blocks/core__query-loop.html +++ b/packages/e2e-tests/fixtures/blocks/core__query-loop.html @@ -1 +1 @@ - +
  • diff --git a/packages/e2e-tests/fixtures/blocks/core__query-loop.json b/packages/e2e-tests/fixtures/blocks/core__query-loop.json index a0ef058ebe6b2..f7c796aecc1d0 100644 --- a/packages/e2e-tests/fixtures/blocks/core__query-loop.json +++ b/packages/e2e-tests/fixtures/blocks/core__query-loop.json @@ -5,6 +5,6 @@ "isValid": true, "attributes": {}, "innerBlocks": [], - "originalContent": "" + "originalContent": "
  • " } ] diff --git a/packages/e2e-tests/fixtures/blocks/core__query-loop.parsed.json b/packages/e2e-tests/fixtures/blocks/core__query-loop.parsed.json index 87dc8a385cc60..f6c81100aa667 100644 --- a/packages/e2e-tests/fixtures/blocks/core__query-loop.parsed.json +++ b/packages/e2e-tests/fixtures/blocks/core__query-loop.parsed.json @@ -3,8 +3,10 @@ "blockName": "core/query-loop", "attrs": {}, "innerBlocks": [], - "innerHTML": "", - "innerContent": [] + "innerHTML": "
  • ", + "innerContent": [ + "
  • " + ] }, { "blockName": null, diff --git a/packages/e2e-tests/fixtures/blocks/core__query-loop.serialized.html b/packages/e2e-tests/fixtures/blocks/core__query-loop.serialized.html index 16de7db3703b0..43e8075cf74a0 100644 --- a/packages/e2e-tests/fixtures/blocks/core__query-loop.serialized.html +++ b/packages/e2e-tests/fixtures/blocks/core__query-loop.serialized.html @@ -1 +1,3 @@ - + +
  • + diff --git a/packages/e2e-tests/fixtures/blocks/core__query.json b/packages/e2e-tests/fixtures/blocks/core__query.json index 3e90d6a3f9c0f..235fcefff51e2 100644 --- a/packages/e2e-tests/fixtures/blocks/core__query.json +++ b/packages/e2e-tests/fixtures/blocks/core__query.json @@ -17,6 +17,9 @@ "search": "", "exclude": [], "sticky": "" + }, + "layout": { + "type": "list" } }, "innerBlocks": [], From a064d194c5f5a31797141d78219fb29dacb4663c Mon Sep 17 00:00:00 2001 From: ntsekouras Date: Fri, 20 Nov 2020 12:22:50 +0200 Subject: [PATCH 7/8] fix php lint --- packages/block-library/src/query-loop/index.php | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/packages/block-library/src/query-loop/index.php b/packages/block-library/src/query-loop/index.php index 1068616c1153c..15f745f2a05d5 100644 --- a/packages/block-library/src/query-loop/index.php +++ b/packages/block-library/src/query-loop/index.php @@ -71,7 +71,7 @@ function render_block_core_query_loop( $attributes, $content, $block ) { $classnames = ''; if ( isset( $block->context['layout'] ) && isset( $block->context['query'] ) ) { - if ( isset( $block->context['layout']['type'] ) && $block->context['layout']['type'] === 'flex' ) { + if ( isset( $block->context['layout']['type'] ) && 'flex' === $block->context['layout']['type'] ) { $classnames = "is-flex-container columns-{$block->context['layout']['columns']}"; } } From 0a10a4448b889315b91e4286f046418019206637 Mon Sep 17 00:00:00 2001 From: ntsekouras Date: Fri, 20 Nov 2020 16:03:21 +0200 Subject: [PATCH 8/8] wrap contents in render callback --- packages/block-library/src/query-loop/index.php | 3 ++- packages/block-library/src/query-loop/save.js | 6 +----- .../src/query/edit/query-inspector-controls.js | 2 +- packages/e2e-tests/fixtures/blocks/core__query-loop.html | 2 +- packages/e2e-tests/fixtures/blocks/core__query-loop.json | 2 +- .../e2e-tests/fixtures/blocks/core__query-loop.parsed.json | 6 ++---- .../fixtures/blocks/core__query-loop.serialized.html | 4 +--- 7 files changed, 9 insertions(+), 16 deletions(-) diff --git a/packages/block-library/src/query-loop/index.php b/packages/block-library/src/query-loop/index.php index 15f745f2a05d5..d1aef57b1cb66 100644 --- a/packages/block-library/src/query-loop/index.php +++ b/packages/block-library/src/query-loop/index.php @@ -80,7 +80,7 @@ function render_block_core_query_loop( $attributes, $content, $block ) { $content = ''; foreach ( $posts as $post ) { - $content .= ( + $block_content = ( new WP_Block( $block->parsed_block, array( @@ -89,6 +89,7 @@ function render_block_core_query_loop( $attributes, $content, $block ) { ) ) )->render( array( 'dynamic' => false ) ); + $content .= "
  • {$block_content}
    • "; } return sprintf( '
      %2$s
    ', diff --git a/packages/block-library/src/query-loop/save.js b/packages/block-library/src/query-loop/save.js index a2afa4dff9b84..25c0128386512 100644 --- a/packages/block-library/src/query-loop/save.js +++ b/packages/block-library/src/query-loop/save.js @@ -4,9 +4,5 @@ import { InnerBlocks } from '@wordpress/block-editor'; export default function QueryLoopSave() { - return ( -
  • - -
    • - ); + return ; } diff --git a/packages/block-library/src/query/edit/query-inspector-controls.js b/packages/block-library/src/query/edit/query-inspector-controls.js index 1af29aa259daa..0be60543a6512 100644 --- a/packages/block-library/src/query/edit/query-inspector-controls.js +++ b/packages/block-library/src/query/edit/query-inspector-controls.js @@ -153,7 +153,7 @@ export default function QueryInspectorControls( { onChange={ ( value ) => setLayout( { columns: value } ) } - min={ 1 } + min={ 2 } max={ Math.max( 6, layout.columns ) } /> { layout.columns > 6 && ( diff --git a/packages/e2e-tests/fixtures/blocks/core__query-loop.html b/packages/e2e-tests/fixtures/blocks/core__query-loop.html index 16143f110d4e4..16de7db3703b0 100644 --- a/packages/e2e-tests/fixtures/blocks/core__query-loop.html +++ b/packages/e2e-tests/fixtures/blocks/core__query-loop.html @@ -1 +1 @@ -
  • + diff --git a/packages/e2e-tests/fixtures/blocks/core__query-loop.json b/packages/e2e-tests/fixtures/blocks/core__query-loop.json index f7c796aecc1d0..a0ef058ebe6b2 100644 --- a/packages/e2e-tests/fixtures/blocks/core__query-loop.json +++ b/packages/e2e-tests/fixtures/blocks/core__query-loop.json @@ -5,6 +5,6 @@ "isValid": true, "attributes": {}, "innerBlocks": [], - "originalContent": "
  • " + "originalContent": "" } ] diff --git a/packages/e2e-tests/fixtures/blocks/core__query-loop.parsed.json b/packages/e2e-tests/fixtures/blocks/core__query-loop.parsed.json index f6c81100aa667..87dc8a385cc60 100644 --- a/packages/e2e-tests/fixtures/blocks/core__query-loop.parsed.json +++ b/packages/e2e-tests/fixtures/blocks/core__query-loop.parsed.json @@ -3,10 +3,8 @@ "blockName": "core/query-loop", "attrs": {}, "innerBlocks": [], - "innerHTML": "
  • ", - "innerContent": [ - "
  • " - ] + "innerHTML": "", + "innerContent": [] }, { "blockName": null, diff --git a/packages/e2e-tests/fixtures/blocks/core__query-loop.serialized.html b/packages/e2e-tests/fixtures/blocks/core__query-loop.serialized.html index 43e8075cf74a0..16de7db3703b0 100644 --- a/packages/e2e-tests/fixtures/blocks/core__query-loop.serialized.html +++ b/packages/e2e-tests/fixtures/blocks/core__query-loop.serialized.html @@ -1,3 +1 @@ - -
  • - +