diff --git a/build/post-type/block.json b/build/post-type/block.json
index 89b513f..b74dc0c 100644
--- a/build/post-type/block.json
+++ b/build/post-type/block.json
@@ -56,6 +56,14 @@
"showLabel": {
"type": "boolean",
"default": true
+ },
+ "displayType": {
+ "type": "string",
+ "default": "select"
+ },
+ "layoutDirection": {
+ "type": "string",
+ "default": "vertical"
}
},
"textdomain": "query-filter",
diff --git a/build/post-type/index-rtl.css b/build/post-type/index-rtl.css
new file mode 100644
index 0000000..5943bcd
--- /dev/null
+++ b/build/post-type/index-rtl.css
@@ -0,0 +1 @@
+@view-transition{navigation:auto}.wp-block-query-filter{display:flex;flex-direction:column;justify-content:stretch}.wp-block-query-filter__checkbox-group,.wp-block-query-filter__radio-group{display:flex;flex-direction:column;gap:.5rem}.wp-block-query-filter__checkbox-group label,.wp-block-query-filter__radio-group label{align-items:center;cursor:pointer;display:flex;gap:.5rem;padding:.25rem 0}.wp-block-query-filter__checkbox-group input,.wp-block-query-filter__radio-group input{margin:0}.wp-block-query-filter__checkbox-group.horizontal,.wp-block-query-filter__radio-group.horizontal{flex-direction:row;flex-wrap:wrap;gap:1rem}
diff --git a/build/post-type/index.asset.php b/build/post-type/index.asset.php
index ff3a7fb..c114f80 100644
--- a/build/post-type/index.asset.php
+++ b/build/post-type/index.asset.php
@@ -1 +1 @@
- array('react-jsx-runtime', 'wp-block-editor', 'wp-blocks', 'wp-components', 'wp-data', 'wp-i18n'), 'version' => 'ad8227c21a432607ccaf');
+ array('react-jsx-runtime', 'wp-block-editor', 'wp-blocks', 'wp-components', 'wp-data', 'wp-i18n'), 'version' => '9f82697921081e520599');
diff --git a/build/post-type/index.css b/build/post-type/index.css
new file mode 100644
index 0000000..5943bcd
--- /dev/null
+++ b/build/post-type/index.css
@@ -0,0 +1 @@
+@view-transition{navigation:auto}.wp-block-query-filter{display:flex;flex-direction:column;justify-content:stretch}.wp-block-query-filter__checkbox-group,.wp-block-query-filter__radio-group{display:flex;flex-direction:column;gap:.5rem}.wp-block-query-filter__checkbox-group label,.wp-block-query-filter__radio-group label{align-items:center;cursor:pointer;display:flex;gap:.5rem;padding:.25rem 0}.wp-block-query-filter__checkbox-group input,.wp-block-query-filter__radio-group input{margin:0}.wp-block-query-filter__checkbox-group.horizontal,.wp-block-query-filter__radio-group.horizontal{flex-direction:row;flex-wrap:wrap;gap:1rem}
diff --git a/build/post-type/index.js b/build/post-type/index.js
index 67b97d8..4fe7f98 100644
--- a/build/post-type/index.js
+++ b/build/post-type/index.js
@@ -1 +1 @@
-(()=>{"use strict";const e=window.wp.blocks,l=window.wp.i18n,t=window.wp.blockEditor,r=window.wp.components,o=window.wp.data,s=window.ReactJSXRuntime,i=JSON.parse('{"UU":"query-filter/post-type"}');(0,e.registerBlockType)(i.UU,{edit:function({attributes:e,setAttributes:i,context:n}){const{emptyLabel:a,label:p,showLabel:c}=e,u=(0,o.useSelect)((e=>(e("core").getPostTypes({per_page:100})||[]).filter((e=>e.viewable))||[]),[]);let y=(n.query.postType||"").split(",").map((e=>e.trim()));Array.isArray(n.query.multiple_posts)&&(y=y.concat(n.query.multiple_posts));const _=y.map((e=>u.find((l=>l.slug===e))||{slug:e,name:e}));return(0,s.jsxs)(s.Fragment,{children:[(0,s.jsx)(t.InspectorControls,{children:(0,s.jsxs)(r.PanelBody,{title:(0,l.__)("Post Type Settings","query-filter"),children:[(0,s.jsx)(r.TextControl,{label:(0,l.__)("Label","query-filter"),value:p,defaultValue:(0,l.__)("Content Type","query-filter"),help:(0,l.__)("If empty then no label will be shown","query-filter"),onChange:e=>i({label:e})}),(0,s.jsx)(r.ToggleControl,{label:(0,l.__)("Show Label","query-filter"),checked:c,onChange:e=>i({showLabel:e})}),(0,s.jsx)(r.TextControl,{label:(0,l.__)("Empty Choice Label","query-filter"),value:a,placeholder:(0,l.__)("All","query-filter"),onChange:e=>i({emptyLabel:e})})]})}),(0,s.jsxs)("div",{...(0,t.useBlockProps)({className:"wp-block-query-filter"}),children:[c&&(0,s.jsx)("label",{className:"wp-block-query-filter-post-type__label wp-block-query-filter__label",children:p||(0,l.__)("Content Type","query-filter")}),(0,s.jsxs)("select",{className:"wp-block-query-filter-post-type__select wp-block-query-filter__select",inert:!0,children:[(0,s.jsx)("option",{children:a||(0,l.__)("All","query-filter")}),_.map((e=>(0,s.jsx)("option",{children:e.name},e.slug)))]})]})]})}})})();
\ No newline at end of file
+(()=>{"use strict";const e=window.wp.blocks,l=window.wp.i18n,t=window.wp.blockEditor,r=window.wp.components,o=window.wp.data,i=window.ReactJSXRuntime,a=JSON.parse('{"UU":"query-filter/post-type"}');(0,e.registerBlockType)(a.UU,{edit:function({attributes:e,setAttributes:a,context:n}){const{emptyLabel:s,label:p,showLabel:c,displayType:u,layoutDirection:_}=e,y=(0,o.useSelect)((e=>(e("core").getPostTypes({per_page:100})||[]).filter((e=>e.viewable))||[]),[]);let b=(n.query.postType||"").split(",").map((e=>e.trim()));Array.isArray(n.query.multiple_posts)&&(b=b.concat(n.query.multiple_posts));const d=b.map((e=>y.find((l=>l.slug===e))||{slug:e,name:e}));return(0,i.jsxs)(i.Fragment,{children:[(0,i.jsx)(t.InspectorControls,{children:(0,i.jsxs)(r.PanelBody,{title:(0,l.__)("Post Type Settings","query-filter"),children:[(0,i.jsx)(r.SelectControl,{label:(0,l.__)("Display Type","query-filter"),value:u,options:[{label:(0,l.__)("Select (Dropdown)","query-filter"),value:"select"},{label:(0,l.__)("Radio (Single Choice)","query-filter"),value:"radio"},{label:(0,l.__)("Checkbox (Multiple Choice)","query-filter"),value:"checkbox"}],onChange:e=>a({displayType:e})}),("radio"===u||"checkbox"===u)&&(0,i.jsxs)(r.__experimentalToggleGroupControl,{label:(0,l.__)("Layout Direction","query-filter"),value:_,onChange:e=>a({layoutDirection:e}),isBlock:!0,__nextHasNoMarginBottom:!0,__next40pxDefaultSize:!0,children:[(0,i.jsx)(r.__experimentalToggleGroupControlOption,{value:"vertical",label:(0,l.__)("Vertical","query-filter")}),(0,i.jsx)(r.__experimentalToggleGroupControlOption,{value:"horizontal",label:(0,l.__)("Horizontal","query-filter")})]}),(0,i.jsx)(r.TextControl,{label:(0,l.__)("Label","query-filter"),value:p,defaultValue:(0,l.__)("Content Type","query-filter"),help:(0,l.__)("If empty then no label will be shown","query-filter"),onChange:e=>a({label:e})}),(0,i.jsx)(r.ToggleControl,{label:(0,l.__)("Show Label","query-filter"),checked:c,onChange:e=>a({showLabel:e})}),(0,i.jsx)(r.TextControl,{label:(0,l.__)("Empty Choice Label","query-filter"),value:s,placeholder:(0,l.__)("All","query-filter"),onChange:e=>a({emptyLabel:e})})]})}),(0,i.jsxs)("div",{...(0,t.useBlockProps)({className:"wp-block-query-filter"}),children:[c&&(0,i.jsx)("label",{className:"wp-block-query-filter-post-type__label wp-block-query-filter__label",children:p||(0,l.__)("Content Type","query-filter")}),"select"===u&&(0,i.jsxs)("select",{className:"wp-block-query-filter-post-type__select wp-block-query-filter__select",inert:!0,children:[(0,i.jsx)("option",{children:s||(0,l.__)("All","query-filter")}),d.map((e=>(0,i.jsx)("option",{children:e.name},e.slug)))]}),"radio"===u&&(0,i.jsxs)("div",{className:"wp-block-query-filter-post-type__radio-group wp-block-query-filter__radio-group"+("horizontal"===_?" horizontal":""),children:[(0,i.jsxs)("label",{children:[(0,i.jsx)("input",{type:"radio",name:"post-type-preview",defaultChecked:!0,inert:!0}),s||(0,l.__)("All","query-filter")]}),d.map((e=>(0,i.jsxs)("label",{children:[(0,i.jsx)("input",{type:"radio",name:"post-type-preview",inert:!0}),e.name]},e.slug)))]}),"checkbox"===u&&(0,i.jsx)("div",{className:"wp-block-query-filter-post-type__checkbox-group wp-block-query-filter__checkbox-group"+("horizontal"===_?" horizontal":""),children:d.map((e=>(0,i.jsxs)("label",{children:[(0,i.jsx)("input",{type:"checkbox",inert:!0}),e.name]},e.slug)))})]})]})}})})();
\ No newline at end of file
diff --git a/build/post-type/render.php b/build/post-type/render.php
index 70d43f2..d6e3b1c 100644
--- a/build/post-type/render.php
+++ b/build/post-type/render.php
@@ -2,6 +2,8 @@
global $wp_query;
$id = 'query-filter-' . wp_generate_uuid4();
+$display_type = $attributes['displayType'] ?? 'select';
+$layout_direction = $attributes['layoutDirection'] ?? 'vertical';
if ( $block->context['query']['inherit'] ) {
$query_var = 'query-post_type';
@@ -45,10 +47,50 @@
-
+
+
+
+
+
+
+
+
+
+
+
+ name, $selected_types, true );
+ $new_types = $is_checked
+ ? array_diff( $selected_types, [ $post_type->name ] )
+ : array_merge( $selected_types, [ $post_type->name ] );
+ $new_types = array_filter( $new_types );
+ $checkbox_url = empty( $new_types )
+ ? $base_url
+ : add_query_arg( [ $query_var => implode( ',', $new_types ), $page_var => false, ], $base_url );
+ ?>
+
+
+
+
diff --git a/build/taxonomy/block.json b/build/taxonomy/block.json
index 6cdb93d..ea0ca35 100644
--- a/build/taxonomy/block.json
+++ b/build/taxonomy/block.json
@@ -59,6 +59,14 @@
"showLabel": {
"type": "boolean",
"default": true
+ },
+ "displayType": {
+ "type": "string",
+ "default": "select"
+ },
+ "layoutDirection": {
+ "type": "string",
+ "default": "vertical"
}
},
"textdomain": "query-filter",
diff --git a/build/taxonomy/index-rtl.css b/build/taxonomy/index-rtl.css
index 39bc4f5..5943bcd 100644
--- a/build/taxonomy/index-rtl.css
+++ b/build/taxonomy/index-rtl.css
@@ -1 +1 @@
-@view-transition{navigation:auto}.wp-block-query-filter{display:flex;flex-direction:column;justify-content:stretch}
+@view-transition{navigation:auto}.wp-block-query-filter{display:flex;flex-direction:column;justify-content:stretch}.wp-block-query-filter__checkbox-group,.wp-block-query-filter__radio-group{display:flex;flex-direction:column;gap:.5rem}.wp-block-query-filter__checkbox-group label,.wp-block-query-filter__radio-group label{align-items:center;cursor:pointer;display:flex;gap:.5rem;padding:.25rem 0}.wp-block-query-filter__checkbox-group input,.wp-block-query-filter__radio-group input{margin:0}.wp-block-query-filter__checkbox-group.horizontal,.wp-block-query-filter__radio-group.horizontal{flex-direction:row;flex-wrap:wrap;gap:1rem}
diff --git a/build/taxonomy/index.asset.php b/build/taxonomy/index.asset.php
index 4b3ef34..efe8b7c 100644
--- a/build/taxonomy/index.asset.php
+++ b/build/taxonomy/index.asset.php
@@ -1 +1 @@
- array('react-jsx-runtime', 'wp-block-editor', 'wp-blocks', 'wp-components', 'wp-data', 'wp-i18n'), 'version' => 'f1456d24ac8e3da497aa');
+ array('react-jsx-runtime', 'wp-block-editor', 'wp-blocks', 'wp-components', 'wp-data', 'wp-i18n'), 'version' => '2f97bf84853a01e2ed52');
diff --git a/build/taxonomy/index.css b/build/taxonomy/index.css
index 39bc4f5..5943bcd 100644
--- a/build/taxonomy/index.css
+++ b/build/taxonomy/index.css
@@ -1 +1 @@
-@view-transition{navigation:auto}.wp-block-query-filter{display:flex;flex-direction:column;justify-content:stretch}
+@view-transition{navigation:auto}.wp-block-query-filter{display:flex;flex-direction:column;justify-content:stretch}.wp-block-query-filter__checkbox-group,.wp-block-query-filter__radio-group{display:flex;flex-direction:column;gap:.5rem}.wp-block-query-filter__checkbox-group label,.wp-block-query-filter__radio-group label{align-items:center;cursor:pointer;display:flex;gap:.5rem;padding:.25rem 0}.wp-block-query-filter__checkbox-group input,.wp-block-query-filter__radio-group input{margin:0}.wp-block-query-filter__checkbox-group.horizontal,.wp-block-query-filter__radio-group.horizontal{flex-direction:row;flex-wrap:wrap;gap:1rem}
diff --git a/build/taxonomy/index.js b/build/taxonomy/index.js
index 5868836..dab208b 100644
--- a/build/taxonomy/index.js
+++ b/build/taxonomy/index.js
@@ -1 +1 @@
-(()=>{"use strict";const e=window.wp.blocks,l=window.wp.i18n,t=window.wp.blockEditor,o=window.wp.components,n=window.wp.data,r=window.ReactJSXRuntime,a=JSON.parse('{"UU":"query-filter/taxonomy"}');(0,e.registerBlockType)(a.UU,{edit:function({attributes:e,setAttributes:a}){const{taxonomy:i,emptyLabel:s,label:c,showLabel:u}=e,b=(0,n.useSelect)((e=>{const l=(e("core").getTaxonomies({per_page:100})||[]).filter((e=>e.visibility.publicly_queryable));return l&&l.length>0&&!i&&a({taxonomy:l[0].slug,label:l[0].name}),l}),[i]),y=(0,n.useSelect)((e=>e("core").getEntityRecords("taxonomy",i,{number:50})||[]),[i]);return(0,r.jsxs)(r.Fragment,{children:[(0,r.jsx)(t.InspectorControls,{children:(0,r.jsxs)(o.PanelBody,{title:(0,l.__)("Taxonomy Settings","query-filter"),children:[(0,r.jsx)(o.SelectControl,{label:(0,l.__)("Select Taxonomy","query-filter"),value:i,options:(b||[]).map((e=>({label:e.name,value:e.slug}))),onChange:e=>a({taxonomy:e,label:b.find((l=>l.slug===e)).name})}),(0,r.jsx)(o.TextControl,{label:(0,l.__)("Label","query-filter"),value:c,help:(0,l.__)("If empty then no label will be shown","query-filter"),onChange:e=>a({label:e})}),(0,r.jsx)(o.ToggleControl,{label:(0,l.__)("Show Label","query-filter"),checked:u,onChange:e=>a({showLabel:e})}),(0,r.jsx)(o.TextControl,{label:(0,l.__)("Empty Choice Label","query-filter"),value:s,placeholder:(0,l.__)("All","query-filter"),onChange:e=>a({emptyLabel:e})})]})}),(0,r.jsxs)("div",{...(0,t.useBlockProps)({className:"wp-block-query-filter"}),children:[u&&(0,r.jsx)("label",{className:"wp-block-query-filter-taxonomy__label wp-block-query-filter__label",children:c}),(0,r.jsxs)("select",{className:"wp-block-query-filter-taxonomy__select wp-block-query-filter__select",inert:!0,children:[(0,r.jsx)("option",{children:s||(0,l.__)("All","query-filter")}),y.map((e=>(0,r.jsx)("option",{children:e.name},e.slug)))]})]})]})}})})();
\ No newline at end of file
+(()=>{"use strict";const e=window.wp.blocks,l=window.wp.i18n,o=window.wp.blockEditor,t=window.wp.components,r=window.wp.data,a=window.ReactJSXRuntime,i=JSON.parse('{"UU":"query-filter/taxonomy"}');(0,e.registerBlockType)(i.UU,{edit:function({attributes:e,setAttributes:i}){const{taxonomy:n,emptyLabel:s,label:c,showLabel:u,displayType:p,layoutDirection:y}=e,_=(0,r.useSelect)((e=>{const l=(e("core").getTaxonomies({per_page:100})||[]).filter((e=>e.visibility.publicly_queryable));return l&&l.length>0&&!n&&i({taxonomy:l[0].slug,label:l[0].name}),l}),[n]),b=(0,r.useSelect)((e=>e("core").getEntityRecords("taxonomy",n,{number:50})||[]),[n]);return(0,a.jsxs)(a.Fragment,{children:[(0,a.jsx)(o.InspectorControls,{children:(0,a.jsxs)(t.PanelBody,{title:(0,l.__)("Taxonomy Settings","query-filter"),children:[(0,a.jsx)(t.SelectControl,{label:(0,l.__)("Select Taxonomy","query-filter"),value:n,options:(_||[]).map((e=>({label:e.name,value:e.slug}))),onChange:e=>i({taxonomy:e,label:_.find((l=>l.slug===e)).name})}),(0,a.jsx)(t.SelectControl,{label:(0,l.__)("Display Type","query-filter"),value:p,options:[{label:(0,l.__)("Select (Dropdown)","query-filter"),value:"select"},{label:(0,l.__)("Radio (Single Choice)","query-filter"),value:"radio"},{label:(0,l.__)("Checkbox (Multiple Choice)","query-filter"),value:"checkbox"}],onChange:e=>i({displayType:e})}),("radio"===p||"checkbox"===p)&&(0,a.jsxs)(t.__experimentalToggleGroupControl,{label:(0,l.__)("Layout Direction","query-filter"),value:y,onChange:e=>i({layoutDirection:e}),isBlock:!0,__nextHasNoMarginBottom:!0,__next40pxDefaultSize:!0,children:[(0,a.jsx)(t.__experimentalToggleGroupControlOption,{value:"vertical",label:(0,l.__)("Vertical","query-filter")}),(0,a.jsx)(t.__experimentalToggleGroupControlOption,{value:"horizontal",label:(0,l.__)("Horizontal","query-filter")})]}),(0,a.jsx)(t.TextControl,{label:(0,l.__)("Label","query-filter"),value:c,help:(0,l.__)("If empty then no label will be shown","query-filter"),onChange:e=>i({label:e})}),(0,a.jsx)(t.ToggleControl,{label:(0,l.__)("Show Label","query-filter"),checked:u,onChange:e=>i({showLabel:e})}),(0,a.jsx)(t.TextControl,{label:(0,l.__)("Empty Choice Label","query-filter"),value:s,placeholder:(0,l.__)("All","query-filter"),onChange:e=>i({emptyLabel:e})})]})}),(0,a.jsxs)("div",{...(0,o.useBlockProps)({className:"wp-block-query-filter"}),children:[u&&(0,a.jsx)("label",{className:"wp-block-query-filter-taxonomy__label wp-block-query-filter__label",children:c}),"select"===p&&(0,a.jsxs)("select",{className:"wp-block-query-filter-taxonomy__select wp-block-query-filter__select",inert:!0,children:[(0,a.jsx)("option",{children:s||(0,l.__)("All","query-filter")}),b.map((e=>(0,a.jsx)("option",{children:e.name},e.slug)))]}),"radio"===p&&(0,a.jsxs)("div",{className:"wp-block-query-filter-taxonomy__radio-group wp-block-query-filter__radio-group"+("horizontal"===y?" horizontal":""),children:[(0,a.jsxs)("label",{children:[(0,a.jsx)("input",{type:"radio",name:"taxonomy-preview",defaultChecked:!0,inert:!0}),s||(0,l.__)("All","query-filter")]}),b.map((e=>(0,a.jsxs)("label",{children:[(0,a.jsx)("input",{type:"radio",name:"taxonomy-preview",inert:!0}),e.name]},e.slug)))]}),"checkbox"===p&&(0,a.jsx)("div",{className:"wp-block-query-filter-taxonomy__checkbox-group wp-block-query-filter__checkbox-group"+("horizontal"===y?" horizontal":""),children:b.map((e=>(0,a.jsxs)("label",{children:[(0,a.jsx)("input",{type:"checkbox",inert:!0}),e.name]},e.slug)))})]})]})}})})();
\ No newline at end of file
diff --git a/build/taxonomy/render.php b/build/taxonomy/render.php
index 97258b4..e80208b 100644
--- a/build/taxonomy/render.php
+++ b/build/taxonomy/render.php
@@ -4,6 +4,8 @@
}
$id = 'query-filter-' . wp_generate_uuid4();
+$display_type = $attributes['displayType'] ?? 'select';
+$layout_direction = $attributes['layoutDirection'] ?? 'vertical';
$taxonomy = get_taxonomy( $attributes['taxonomy'] );
@@ -30,13 +32,55 @@
?>
'wp-block-query-filter' ] ); ?> data-wp-interactive="query-filter" data-wp-context="{}">
-
diff --git a/inc/namespace.php b/inc/namespace.php
index 6457f8f..63a0ecb 100644
--- a/inc/namespace.php
+++ b/inc/namespace.php
@@ -73,7 +73,7 @@ function filter_query_loop_block_query_vars( array $query, \WP_Block $block, int
/**
* Fires after the query variable object is created, but before the actual query is run.
*
- * @param WP_Query $query The WP_Query instance (passed by reference).
+ * @param WP_Query $query The WP_Query instance (passed by reference).
*/
function pre_get_posts_transpose_query_vars( WP_Query $query ) : void {
$query_id = $query->get( 'query_id', null );
@@ -105,12 +105,29 @@ function pre_get_posts_transpose_query_vars( WP_Query $query ) : void {
// Handle taxonomies specifically.
if ( get_taxonomy( $key ) ) {
+ // If multiple taxonomy filters are selected, ALL of them must match.
$tax_query['relation'] = 'AND';
- $tax_query[] = [
- 'taxonomy' => $key,
- 'terms' => [ $value ],
- 'field' => 'slug',
- ];
+
+ // Handle multiple values separated by commas (for checkbox mode)
+ $values = wp_parse_list( $value );
+
+ if ( count( $values ) > 1 ) {
+ // If multiple terms in a taxonomy are selected, posts with
+ // ANY of the selected terms should be returned.
+ $tax_query[] = [
+ 'taxonomy' => $key,
+ 'terms' => $values,
+ 'field' => 'slug',
+ 'operator' => 'IN',
+ ];
+ } else {
+ // Single value: normal behavior
+ $tax_query[] = [
+ 'taxonomy' => $key,
+ 'terms' => $values,
+ 'field' => 'slug',
+ ];
+ }
} else {
// Other options should map directly to query vars.
$key = sanitize_key( $key );
@@ -176,7 +193,7 @@ function render_block_search( string $block_content, array $block, \WP_Block $in
? sprintf( 'query-%d-s', $instance->context['queryId'] ?? 0 )
: 'query-s';
- $action = str_replace( '/page/'. get_query_var( 'paged', 1 ), '', add_query_arg( [ $query_var => '' ] ) );
+ $action = str_replace( '/page/' . get_query_var( 'paged', 1 ), '', add_query_arg( [ $query_var => '' ] ) );
// Note sanitize_text_field trims whitespace from start/end of string causing unexpected behaviour.
$value = wp_unslash( $_GET[ $query_var ] ?? '' );
diff --git a/src/post-type/block.json b/src/post-type/block.json
index 0d1af2e..e768992 100644
--- a/src/post-type/block.json
+++ b/src/post-type/block.json
@@ -51,6 +51,14 @@
"showLabel": {
"type": "boolean",
"default": true
+ },
+ "displayType": {
+ "type": "string",
+ "default": "select"
+ },
+ "layoutDirection": {
+ "type": "string",
+ "default": "vertical"
}
},
"textdomain": "query-filter",
diff --git a/src/post-type/edit.js b/src/post-type/edit.js
index 5bbd52c..4a68bc9 100644
--- a/src/post-type/edit.js
+++ b/src/post-type/edit.js
@@ -1,10 +1,18 @@
import { __ } from '@wordpress/i18n';
import { useBlockProps, InspectorControls } from '@wordpress/block-editor';
-import { PanelBody, TextControl, ToggleControl } from '@wordpress/components';
+import {
+ PanelBody,
+ TextControl,
+ ToggleControl,
+ SelectControl,
+ __experimentalToggleGroupControl as ToggleGroupControl,
+ __experimentalToggleGroupControlOption as ToggleGroupControlOption,
+} from '@wordpress/components';
import { useSelect } from '@wordpress/data';
export default function Edit( { attributes, setAttributes, context } ) {
- const { emptyLabel, label, showLabel } = attributes;
+ const { emptyLabel, label, showLabel, displayType, layoutDirection } =
+ attributes;
const allPostTypes = useSelect( ( select ) => {
return (
@@ -38,6 +46,67 @@ export default function Edit( { attributes, setAttributes, context } ) {
<>
+ {
+ if ( nextDisplayType === 'select' ) {
+ setAttributes( {
+ displayType: nextDisplayType,
+ layoutDirection: undefined,
+ } );
+ } else {
+ setAttributes( {
+ displayType: nextDisplayType,
+ } );
+ }
+ } }
+ />
+ { ( displayType === 'radio' ||
+ displayType === 'checkbox' ) && (
+
+ setAttributes( { layoutDirection } )
+ }
+ isBlock
+ __nextHasNoMarginBottom
+ __next40pxDefaultSize
+ >
+
+
+
+ ) }
) }
-
-
- { postTypes.map( ( type ) => (
-
- ) ) }
-
+ { displayType === 'select' && (
+
+
+ { postTypes.map( ( type ) => (
+
+ ) ) }
+
+ ) }
+ { displayType === 'radio' && (
+
+
+
+ { emptyLabel || __( 'All', 'query-filter' ) }
+
+ { postTypes.map( ( type ) => (
+
+
+ { type.name }
+
+ ) ) }
+
+ ) }
+ { displayType === 'checkbox' && (
+
+ { postTypes.map( ( type ) => (
+
+
+ { type.name }
+
+ ) ) }
+
+ ) }
>
);
diff --git a/src/post-type/render.php b/src/post-type/render.php
index 70d43f2..d6e3b1c 100644
--- a/src/post-type/render.php
+++ b/src/post-type/render.php
@@ -2,6 +2,8 @@
global $wp_query;
$id = 'query-filter-' . wp_generate_uuid4();
+$display_type = $attributes['displayType'] ?? 'select';
+$layout_direction = $attributes['layoutDirection'] ?? 'vertical';
if ( $block->context['query']['inherit'] ) {
$query_var = 'query-post_type';
@@ -45,10 +47,50 @@
-
+
+
+
-
+
+
+
+
+ />
+
+
+
+
+ name, wp_unslash( $_GET[ $query_var ] ?? '' ) ); ?> />
+ label ); ?>
+
+
+
+
+
+
+
+ name, $selected_types, true );
+ $new_types = $is_checked
+ ? array_diff( $selected_types, [ $post_type->name ] )
+ : array_merge( $selected_types, [ $post_type->name ] );
+ $new_types = array_filter( $new_types );
+ $checkbox_url = empty( $new_types )
+ ? $base_url
+ : add_query_arg( [ $query_var => implode( ',', $new_types ), $page_var => false, ], $base_url );
+ ?>
+
+ />
+ label ); ?>
+
+
+
+
diff --git a/src/taxonomy/block.json b/src/taxonomy/block.json
index 1f1a331..f0992b4 100644
--- a/src/taxonomy/block.json
+++ b/src/taxonomy/block.json
@@ -54,6 +54,14 @@
"showLabel": {
"type": "boolean",
"default": true
+ },
+ "displayType": {
+ "type": "string",
+ "default": "select"
+ },
+ "layoutDirection": {
+ "type": "string",
+ "default": "vertical"
}
},
"textdomain": "query-filter",
diff --git a/src/taxonomy/edit.js b/src/taxonomy/edit.js
index 5562901..4855e3d 100644
--- a/src/taxonomy/edit.js
+++ b/src/taxonomy/edit.js
@@ -5,11 +5,20 @@ import {
SelectControl,
TextControl,
ToggleControl,
+ __experimentalToggleGroupControl as ToggleGroupControl,
+ __experimentalToggleGroupControlOption as ToggleGroupControlOption,
} from '@wordpress/components';
import { useSelect } from '@wordpress/data';
export default function Edit( { attributes, setAttributes } ) {
- const { taxonomy, emptyLabel, label, showLabel } = attributes;
+ const {
+ taxonomy,
+ emptyLabel,
+ label,
+ showLabel,
+ displayType,
+ layoutDirection,
+ } = attributes;
const taxonomies = useSelect(
( select ) => {
@@ -60,6 +69,67 @@ export default function Edit( { attributes, setAttributes } ) {
} )
}
/>
+ {
+ if ( nextDisplayType === 'select' ) {
+ setAttributes( {
+ displayType: nextDisplayType,
+ layoutDirection: undefined,
+ } );
+ } else {
+ setAttributes( {
+ displayType: nextDisplayType,
+ } );
+ }
+ } }
+ />
+ { ( displayType === 'radio' ||
+ displayType === 'checkbox' ) && (
+
+ setAttributes( { layoutDirection } )
+ }
+ isBlock
+ __nextHasNoMarginBottom
+ __next40pxDefaultSize
+ >
+
+
+
+ ) }
) }
-
-
- { terms.map( ( term ) => (
-
- ) ) }
-
+ { displayType === 'select' && (
+
+
+ { terms.map( ( term ) => (
+
+ ) ) }
+
+ ) }
+ { displayType === 'radio' && (
+
+
+
+ { emptyLabel || __( 'All', 'query-filter' ) }
+
+ { terms.map( ( term ) => (
+
+
+ { term.name }
+
+ ) ) }
+
+ ) }
+ { displayType === 'checkbox' && (
+
+ { terms.map( ( term ) => (
+
+
+ { term.name }
+
+ ) ) }
+
+ ) }
>
);
diff --git a/src/taxonomy/index.js b/src/taxonomy/index.js
index 30d8967..0157b8f 100644
--- a/src/taxonomy/index.js
+++ b/src/taxonomy/index.js
@@ -1,7 +1,6 @@
import { registerBlockType } from '@wordpress/blocks';
import Edit from './edit';
import metadata from './block.json';
-import './style-index.css';
registerBlockType( metadata.name, {
/**
diff --git a/src/taxonomy/render.php b/src/taxonomy/render.php
index 97258b4..e80208b 100644
--- a/src/taxonomy/render.php
+++ b/src/taxonomy/render.php
@@ -4,6 +4,8 @@
}
$id = 'query-filter-' . wp_generate_uuid4();
+$display_type = $attributes['displayType'] ?? 'select';
+$layout_direction = $attributes['layoutDirection'] ?? 'vertical';
$taxonomy = get_taxonomy( $attributes['taxonomy'] );
@@ -30,13 +32,55 @@
?>
'wp-block-query-filter' ] ); ?> data-wp-interactive="query-filter" data-wp-context="{}">
-
+
label ); ?>
-
-
-
-
-
-
+
+
+
+
+
+
+
+
+
+
+
+ />
+
+
+
+
+ slug, wp_unslash( $_GET[ $query_var ] ?? '' ) ); ?> />
+ name ); ?>
+
+
+
+
+
+
+
+ slug, $selected_terms, true );
+ $new_terms = $is_checked
+ ? array_diff( $selected_terms, [ $term->slug ] )
+ : array_merge( $selected_terms, [ $term->slug ] );
+ $new_terms = array_filter( $new_terms );
+ $checkbox_url = empty( $new_terms )
+ ? $base_url
+ : add_query_arg( [ $query_var => implode( ',', $new_terms ), $page_var => false ], $base_url );
+ ?>
+
+ />
+ name ); ?>
+
+
+
+
diff --git a/src/taxonomy/style-index.css b/src/taxonomy/style-index.css
index 621fee1..29f189a 100644
--- a/src/taxonomy/style-index.css
+++ b/src/taxonomy/style-index.css
@@ -7,3 +7,33 @@
flex-direction: column;
justify-content: stretch;
}
+
+/* Radio group styles */
+.wp-block-query-filter__radio-group,
+.wp-block-query-filter__checkbox-group {
+ display: flex;
+ flex-direction: column;
+ gap: 0.5rem;
+}
+
+.wp-block-query-filter__radio-group label,
+.wp-block-query-filter__checkbox-group label {
+ display: flex;
+ align-items: center;
+ gap: 0.5rem;
+ cursor: pointer;
+ padding: 0.25rem 0;
+}
+
+.wp-block-query-filter__radio-group input,
+.wp-block-query-filter__checkbox-group input {
+ margin: 0;
+}
+
+/* Horizontal layout option */
+.wp-block-query-filter__radio-group.horizontal,
+.wp-block-query-filter__checkbox-group.horizontal {
+ flex-direction: row;
+ flex-wrap: wrap;
+ gap: 1rem;
+}