From 4b160482b0af4565859e1bec6cda7ff83bacc793 Mon Sep 17 00:00:00 2001 From: jeremyfelt Date: Tue, 23 Jul 2024 21:41:50 -0700 Subject: [PATCH 1/8] WIP --- build/show-hide-details/block.json | 16 +++++++ build/show-hide-details/index.asset.php | 1 + build/show-hide-details/index.js | 1 + build/show-hide-group/index.asset.php | 2 +- build/show-hide-group/index.js | 2 +- build/show-hide-section/block.json | 5 --- build/show-hide-section/index.asset.php | 2 +- build/show-hide-section/index.js | 2 +- build/show-hide-summary/block.json | 50 +++++++++++++++++++++ build/show-hide-summary/index.asset.php | 1 + build/show-hide-summary/index.js | 1 + plugin.php | 2 + src/show-hide-details/block.json | 14 ++++++ src/show-hide-details/index.js | 34 +++++++++++++++ src/show-hide-details/index.php | 17 ++++++++ src/show-hide-group/index.js | 6 --- src/show-hide-section/block.json | 5 --- src/show-hide-section/index.js | 58 +++++++------------------ src/show-hide-summary/block.json | 48 ++++++++++++++++++++ src/show-hide-summary/index.js | 46 ++++++++++++++++++++ src/show-hide-summary/index.php | 17 ++++++++ test.html | 2 + 22 files changed, 269 insertions(+), 63 deletions(-) create mode 100644 build/show-hide-details/block.json create mode 100644 build/show-hide-details/index.asset.php create mode 100644 build/show-hide-details/index.js create mode 100644 build/show-hide-summary/block.json create mode 100644 build/show-hide-summary/index.asset.php create mode 100644 build/show-hide-summary/index.js create mode 100644 src/show-hide-details/block.json create mode 100644 src/show-hide-details/index.js create mode 100644 src/show-hide-details/index.php create mode 100644 src/show-hide-summary/block.json create mode 100644 src/show-hide-summary/index.js create mode 100644 src/show-hide-summary/index.php create mode 100644 test.html diff --git a/build/show-hide-details/block.json b/build/show-hide-details/block.json new file mode 100644 index 0000000..77a4ae6 --- /dev/null +++ b/build/show-hide-details/block.json @@ -0,0 +1,16 @@ +{ + "$schema": "https://json.schemastore.org/block.json", + "apiVersion": 2, + "name": "happyprime/show-hide-details", + "title": "Show Hide Details", + "textdomain": "show-hide-section-block", + "category": "widgets", + "description": "The remaining content in a details section.", + "icon": "media-document", + "parent": [ + "happyprime/show-hide-section" + ], + "attributes": {}, + "supports": {}, + "editorScript": "file:index.js" +} \ No newline at end of file diff --git a/build/show-hide-details/index.asset.php b/build/show-hide-details/index.asset.php new file mode 100644 index 0000000..8d1e928 --- /dev/null +++ b/build/show-hide-details/index.asset.php @@ -0,0 +1 @@ + array('wp-block-editor', 'wp-blocks', 'wp-element', 'wp-i18n'), 'version' => '2327d2db249c80917f77'); diff --git a/build/show-hide-details/index.js b/build/show-hide-details/index.js new file mode 100644 index 0000000..4bf9692 --- /dev/null +++ b/build/show-hide-details/index.js @@ -0,0 +1 @@ +!function(){"use strict";var e=window.wp.element,t=window.wp.blocks,i=window.wp.blockEditor,n=window.wp.i18n,o=JSON.parse('{"$schema":"https://json.schemastore.org/block.json","apiVersion":2,"name":"happyprime/show-hide-details","title":"Show Hide Details","textdomain":"show-hide-section-block","category":"widgets","description":"The remaining content in a details section.","icon":"media-document","parent":["happyprime/show-hide-section"],"attributes":{},"supports":{},"editorScript":"file:index.js"}');(0,t.registerBlockType)(o,{edit:()=>{const t=[["core/paragraph",{placeholder:(0,n.__)("Remaining","show-hide-section-block")}]];return(0,e.createElement)(e.Fragment,null,(0,e.createElement)(i.InnerBlocks,{template:t,templateLock:!1}))},save:()=>(0,e.createElement)(i.InnerBlocks.Content,null)})}(); \ No newline at end of file diff --git a/build/show-hide-group/index.asset.php b/build/show-hide-group/index.asset.php index 8467f7b..140077d 100644 --- a/build/show-hide-group/index.asset.php +++ b/build/show-hide-group/index.asset.php @@ -1 +1 @@ - array('wp-block-editor', 'wp-blocks', 'wp-components', 'wp-data', 'wp-element', 'wp-i18n'), 'version' => '9821368a8f1930a9690c'); + array('wp-block-editor', 'wp-blocks', 'wp-components', 'wp-data', 'wp-element', 'wp-i18n'), 'version' => '632e0b996cf0eaeabf03'); diff --git a/build/show-hide-group/index.js b/build/show-hide-group/index.js index 2866c44..3b00e0b 100644 --- a/build/show-hide-group/index.js +++ b/build/show-hide-group/index.js @@ -1 +1 @@ -!function(){"use strict";var e=window.wp.element,t=window.wp.blocks,o=window.wp.blockEditor,l=window.wp.components,a=window.wp.data,i=window.wp.i18n,n=JSON.parse('{"$schema":"https://json.schemastore.org/block.json","apiVersion":2,"name":"happyprime/show-hide-group","title":"Show Hide Group","textdomain":"show-hide-section-block","category":"widgets","description":"A group of accessible summaries that can be toggled to show or hide additional details.","icon":"hidden","attributes":{"hasToggle":{"type":"boolean","default":false}},"supports":{"align":true,"alignWide":true,"anchor":true,"color":{"background":true,"enableContrastChecker":true,"text":true,"link":true,"gradients":true},"defaultStylePicker":true,"dimensions":{"minHeight":true},"html":false,"position":{"sticky":false},"spacing":{"margin":true,"padding":true},"typography":{"fontSize":true,"lineHeight":true}},"editorScript":"file:index.js","viewScript":"file:view.js"}');(0,t.registerBlockType)(n,{edit:t=>{const{attributes:{hasToggle:n},setAttributes:r}=t,s=(0,a.useSelect)((e=>e("core/block-editor").getBlocks(t.clientId)));return(0,e.createElement)(e.Fragment,null,(0,e.createElement)(o.InspectorControls,null,(0,e.createElement)(l.PanelBody,null,(0,e.createElement)(l.ToggleControl,{label:(0,i.__)("Has open/close all toggle","show-hide-section-block"),help:n?(0,i.__)("Open/close all toggle will display.","show-hide-section-block"):(0,i.__)("Open/close all toggle will not display.","show-hide-section-block"),checked:n,onChange:e=>{r({hasToggle:e})}}))),(0,e.createElement)("div",(0,o.useBlockProps)(),n&&(0,e.createElement)("button",{className:"toggle-all","aria-expanded":"false",onClick:e=>{!1===e.target.ariaExpanded?(s.forEach((e=>{(0,a.dispatch)("core/block-editor").updateBlockAttributes(e.clientId,{isOpen:!0})})),e.target.innerText=(0,i.__)("Close all","show-hide-section-block"),e.target.ariaExpanded=!0):(s.forEach((e=>{(0,a.dispatch)("core/block-editor").updateBlockAttributes(e.clientId,{isOpen:!1})})),e.target.innerText=(0,i.__)("Open all","show-hide-section-block"),e.target.ariaExpanded=!1)}},(0,i.__)("Open all","show-hide-section-block")),(0,e.createElement)(o.InnerBlocks,{allowedBlocks:["happyprime/show-hide-section"],template:[["happyprime/show-hide-section",{},[["core/paragraph",{}]]],["happyprime/show-hide-section",{},[["core/paragraph",{}]]]],templateLock:!1})))},save:t=>{const{attributes:{hasToggle:l}}=t;return(0,e.createElement)("div",o.useBlockProps.save(),l&&(0,e.createElement)("button",{className:"toggle-all","aria-expanded":"false"},(0,i.__)("Open all","show-hide-section-block")),(0,e.createElement)(o.InnerBlocks.Content,null))}})}(); \ No newline at end of file +!function(){"use strict";var e=window.wp.element,t=window.wp.blocks,o=window.wp.blockEditor,l=window.wp.components,i=window.wp.data,a=window.wp.i18n,n=JSON.parse('{"$schema":"https://json.schemastore.org/block.json","apiVersion":2,"name":"happyprime/show-hide-group","title":"Show Hide Group","textdomain":"show-hide-section-block","category":"widgets","description":"A group of accessible summaries that can be toggled to show or hide additional details.","icon":"hidden","attributes":{"hasToggle":{"type":"boolean","default":false}},"supports":{"align":true,"alignWide":true,"anchor":true,"color":{"background":true,"enableContrastChecker":true,"text":true,"link":true,"gradients":true},"defaultStylePicker":true,"dimensions":{"minHeight":true},"html":false,"position":{"sticky":false},"spacing":{"margin":true,"padding":true},"typography":{"fontSize":true,"lineHeight":true}},"editorScript":"file:index.js","viewScript":"file:view.js"}');(0,t.registerBlockType)(n,{edit:t=>{const{attributes:{hasToggle:n},setAttributes:s}=t,r=(0,i.useSelect)((e=>e("core/block-editor").getBlocks(t.clientId)));return(0,e.createElement)(e.Fragment,null,(0,e.createElement)(o.InspectorControls,null,(0,e.createElement)(l.PanelBody,null,(0,e.createElement)(l.ToggleControl,{label:(0,a.__)("Has open/close all toggle","show-hide-section-block"),help:n?(0,a.__)("Open/close all toggle will display.","show-hide-section-block"):(0,a.__)("Open/close all toggle will not display.","show-hide-section-block"),checked:n,onChange:e=>{s({hasToggle:e})}}))),(0,e.createElement)("div",(0,o.useBlockProps)(),n&&(0,e.createElement)("button",{className:"toggle-all","aria-expanded":"false",onClick:e=>{!1===e.target.ariaExpanded?(r.forEach((e=>{(0,i.dispatch)("core/block-editor").updateBlockAttributes(e.clientId,{isOpen:!0})})),e.target.innerText=(0,a.__)("Close all","show-hide-section-block"),e.target.ariaExpanded=!0):(r.forEach((e=>{(0,i.dispatch)("core/block-editor").updateBlockAttributes(e.clientId,{isOpen:!1})})),e.target.innerText=(0,a.__)("Open all","show-hide-section-block"),e.target.ariaExpanded=!1)}},(0,a.__)("Open all","show-hide-section-block")),(0,e.createElement)(o.InnerBlocks,{allowedBlocks:["happyprime/show-hide-section"],template:[["happyprime/show-hide-section",{}]],templateLock:!1})))},save:t=>{const{attributes:{hasToggle:l}}=t;return(0,e.createElement)("div",o.useBlockProps.save(),l&&(0,e.createElement)("button",{className:"toggle-all","aria-expanded":"false"},(0,a.__)("Open all","show-hide-section-block")),(0,e.createElement)(o.InnerBlocks.Content,null))}})}(); \ No newline at end of file diff --git a/build/show-hide-section/block.json b/build/show-hide-section/block.json index 970b2c9..f0c54d0 100644 --- a/build/show-hide-section/block.json +++ b/build/show-hide-section/block.json @@ -14,11 +14,6 @@ "isOpen": { "type": "boolean", "default": false - }, - "summary": { - "type": "string", - "source": "html", - "selector": "summary" } }, "supports": { diff --git a/build/show-hide-section/index.asset.php b/build/show-hide-section/index.asset.php index 8cb14e9..6bbee6d 100644 --- a/build/show-hide-section/index.asset.php +++ b/build/show-hide-section/index.asset.php @@ -1 +1 @@ - array('wp-block-editor', 'wp-blocks', 'wp-element', 'wp-i18n'), 'version' => 'b7962f8806702068f778'); + array('wp-block-editor', 'wp-blocks', 'wp-element', 'wp-i18n'), 'version' => '8752e7fc0726f8632a8b'); diff --git a/build/show-hide-section/index.js b/build/show-hide-section/index.js index b7eff3a..1879b43 100644 --- a/build/show-hide-section/index.js +++ b/build/show-hide-section/index.js @@ -1 +1 @@ -!function(){"use strict";function e(){return e=Object.assign?Object.assign.bind():function(e){for(var t=1;t{const{attributes:{isOpen:i,summary:a},setAttributes:s}=n;return(0,t.createElement)("details",e({},(0,r.useBlockProps)(),{open:i}),(0,t.createElement)(r.RichText,{tagName:"summary",label:(0,o.__)("Summary","show-hide-section-block"),placeholder:(0,o.__)("Summary","show-hide-section-block"),value:a,allowedFormats:["core/bold","core/italic"],onChange:e=>{s({summary:e})},onKeyUp:e=>{" "===e.key&&(e.preventDefault(),(e=>{const{ownerDocument:t}=e,{defaultView:n}=t,r=n.getSelection().getRangeAt(0),o=document.createTextNode(" ");r.deleteContents(),r.insertNode(o),r.setStartAfter(o)})(e.target))}}),(0,t.createElement)(r.InnerBlocks,null))},save:e=>{const{attributes:{summary:n}}=e;return(0,t.createElement)("details",r.useBlockProps.save(),(0,t.createElement)("summary",null,(0,t.createElement)(r.RichText.Content,{tag:"summary",value:n})),(0,t.createElement)(r.InnerBlocks.Content,null))}})}(); \ No newline at end of file +!function(){"use strict";var e=window.wp.element,t=window.wp.blocks,i=window.wp.blockEditor,o=window.wp.i18n,s=JSON.parse('{"$schema":"https://json.schemastore.org/block.json","apiVersion":2,"name":"happyprime/show-hide-section","title":"Show Hide Section","textdomain":"show-hide-section-block","category":"widgets","description":"A section of collapsible content contained in a details element with a summary.","icon":"media-document","parent":["happyprime/show-hide-group"],"attributes":{"isOpen":{"type":"boolean","default":false}},"supports":{"anchor":true,"align":true,"alignWide":true,"color":{"background":true,"enableContrastChecker":true,"text":true,"link":true,"gradients":true},"defaultStylePicker":true,"dimensions":{"minHeight":true},"html":false,"multiple":true,"position":{"sticky":false},"spacing":{"margin":true,"padding":true},"typography":{"fontSize":true,"lineHeight":true}},"editorScript":"file:index.js"}');(0,t.registerBlockType)(s,{edit:t=>{const{attributes:{isOpen:s},setAttributes:r,isSelected:n}=t,a=[["happyprime/show-hide-summary",{summary:(0,o.__)("Summary","show-hide-section-block")}],["happyprime/show-hide-details",{details:(0,o.__)("Details","show-hide-section-block")}]];return(0,e.createElement)("div",(0,i.useBlockProps)(),(0,e.createElement)(i.InnerBlocks,{template:a,allowedBlocks:["happyprime/show-hide-summary","happyprime/show-hide-details"],templateLock:"all"}))},save:()=>(0,e.createElement)("details",i.useBlockProps.save(),(0,e.createElement)(i.InnerBlocks.Content,null))})}(); \ No newline at end of file diff --git a/build/show-hide-summary/block.json b/build/show-hide-summary/block.json new file mode 100644 index 0000000..0557e1f --- /dev/null +++ b/build/show-hide-summary/block.json @@ -0,0 +1,50 @@ +{ + "$schema": "https://json.schemastore.org/block.json", + "apiVersion": 2, + "name": "happyprime/show-hide-summary", + "title": "Show Hide Summary", + "textdomain": "show-hide-section-block", + "category": "widgets", + "description": "The summary element in a details section.", + "icon": "media-document", + "parent": [ + "happyprime/show-hide-section" + ], + "attributes": { + "summary": { + "type": "string", + "source": "html", + "selector": "summary" + } + }, + "supports": { + "anchor": true, + "align": true, + "alignWide": true, + "color": { + "background": true, + "enableContrastChecker": true, + "text": true, + "link": true, + "gradients": true + }, + "defaultStylePicker": true, + "dimensions": { + "minHeight": true + }, + "html": false, + "multiple": true, + "position": { + "sticky": false + }, + "spacing": { + "margin": true, + "padding": true + }, + "typography": { + "fontSize": true, + "lineHeight": true + } + }, + "editorScript": "file:index.js" +} \ No newline at end of file diff --git a/build/show-hide-summary/index.asset.php b/build/show-hide-summary/index.asset.php new file mode 100644 index 0000000..ba8a946 --- /dev/null +++ b/build/show-hide-summary/index.asset.php @@ -0,0 +1 @@ + array('wp-block-editor', 'wp-blocks', 'wp-element', 'wp-i18n'), 'version' => '703e95fb4c8ea4825606'); diff --git a/build/show-hide-summary/index.js b/build/show-hide-summary/index.js new file mode 100644 index 0000000..30df361 --- /dev/null +++ b/build/show-hide-summary/index.js @@ -0,0 +1 @@ +!function(){"use strict";var e=window.wp.element,t=window.wp.blocks,r=window.wp.blockEditor,i=window.wp.i18n,s=JSON.parse('{"$schema":"https://json.schemastore.org/block.json","apiVersion":2,"name":"happyprime/show-hide-summary","title":"Show Hide Summary","textdomain":"show-hide-section-block","category":"widgets","description":"The summary element in a details section.","icon":"media-document","parent":["happyprime/show-hide-section"],"attributes":{"summary":{"type":"string","source":"html","selector":"summary"}},"supports":{"anchor":true,"align":true,"alignWide":true,"color":{"background":true,"enableContrastChecker":true,"text":true,"link":true,"gradients":true},"defaultStylePicker":true,"dimensions":{"minHeight":true},"html":false,"multiple":true,"position":{"sticky":false},"spacing":{"margin":true,"padding":true},"typography":{"fontSize":true,"lineHeight":true}},"editorScript":"file:index.js"}');(0,t.registerBlockType)(s,{edit:t=>{const{attributes:{summary:s},setAttributes:o}=t;return(0,e.createElement)("summary",(0,r.useBlockProps)(),(0,e.createElement)(r.RichText,{tagName:"div",label:(0,i.__)("Summary","show-hide-section-block"),placeholder:(0,i.__)("Summary","show-hide-section-block"),value:s,allowedFormats:["core/bold","core/italic"],onChange:e=>{o({summary:e})}}))},save:t=>{const{attributes:{summary:i}}=t;return(0,e.createElement)("summary",r.useBlockProps.save(),(0,e.createElement)(r.RichText.Content,{tag:"summary",value:i}))}})}(); \ No newline at end of file diff --git a/plugin.php b/plugin.php index 35e3a9c..ff781a1 100644 --- a/plugin.php +++ b/plugin.php @@ -32,5 +32,7 @@ define( 'HP_SHS_PLUGIN_DIR', __DIR__ ); define( 'HP_SHS_PLUGIN_FILE', __FILE__ ); +require_once __DIR__ . '/src/show-hide-details/index.php'; require_once __DIR__ . '/src/show-hide-group/index.php'; require_once __DIR__ . '/src/show-hide-section/index.php'; +require_once __DIR__ . '/src/show-hide-summary/index.php'; diff --git a/src/show-hide-details/block.json b/src/show-hide-details/block.json new file mode 100644 index 0000000..df80b71 --- /dev/null +++ b/src/show-hide-details/block.json @@ -0,0 +1,14 @@ +{ + "$schema": "https://json.schemastore.org/block.json", + "apiVersion": 2, + "name": "happyprime/show-hide-details", + "title": "Show Hide Details", + "textdomain": "show-hide-section-block", + "category": "widgets", + "description": "The remaining content in a details section.", + "icon": "media-document", + "parent": [ "happyprime/show-hide-section" ], + "attributes": {}, + "supports": {}, + "editorScript": "file:index.js" +} diff --git a/src/show-hide-details/index.js b/src/show-hide-details/index.js new file mode 100644 index 0000000..14abf97 --- /dev/null +++ b/src/show-hide-details/index.js @@ -0,0 +1,34 @@ +import { registerBlockType } from '@wordpress/blocks'; +import { InnerBlocks, RichText, useBlockProps } from '@wordpress/block-editor'; +import { __ } from '@wordpress/i18n'; + +// Internal dependencies. +import metadata from './block.json'; + +const Edit = () => { + + const TEMPLATE = [ + [ 'core/paragraph', { placeholder: __( 'Remaining', 'show-hide-section-block' ) } ], + ]; + + return ( + <> + + + ); +}; + +const Save = () => { + return ( + + ); +}; + +// Register the block. +registerBlockType( metadata, { + edit: Edit, + save: Save, +} ); diff --git a/src/show-hide-details/index.php b/src/show-hide-details/index.php new file mode 100644 index 0000000..575515c --- /dev/null +++ b/src/show-hide-details/index.php @@ -0,0 +1,17 @@ + { [ 'happyprime/show-hide-section', {}, - [ [ 'core/paragraph', {} ] ], - ], - [ - 'happyprime/show-hide-section', - {}, - [ [ 'core/paragraph', {} ] ], ], ] } templateLock={ false } diff --git a/src/show-hide-section/block.json b/src/show-hide-section/block.json index 1c4c8f6..3e87128 100644 --- a/src/show-hide-section/block.json +++ b/src/show-hide-section/block.json @@ -12,11 +12,6 @@ "isOpen": { "type": "boolean", "default": false - }, - "summary": { - "type": "string", - "source": "html", - "selector": "summary" } }, "supports": { diff --git a/src/show-hide-section/index.js b/src/show-hide-section/index.js index 3f45b2d..75a20fc 100644 --- a/src/show-hide-section/index.js +++ b/src/show-hide-section/index.js @@ -7,62 +7,34 @@ import metadata from './block.json'; const Edit = ( props ) => { const { - attributes: { isOpen, summary }, + attributes: { isOpen }, setAttributes, + isSelected, } = props; - /** - * Insert a space at the current position of the cursor and then adjust - * the cursor position, accounting for any selection it has made. - * - * @param {Node} node - */ - const insertSpace = ( node ) => { - const { ownerDocument } = node; - const { defaultView } = ownerDocument; + // Create an inner blocks template for the content. + const TEMPLATE = [ + [ 'happyprime/show-hide-summary', { summary: __( 'Summary', 'show-hide-section-block' ) } ], + [ 'happyprime/show-hide-details', { details: __( 'Details', 'show-hide-section-block' ) } ], + ]; - const sel = defaultView.getSelection(); - const range = sel.getRangeAt( 0 ); - const textNode = document.createTextNode( ' ' ); + // Does this block have focus? - range.deleteContents(); - range.insertNode( textNode ); - range.setStartAfter( textNode ); - }; return ( -
- { - setAttributes( { summary: value } ); - } } - onKeyUp={ ( evt ) => { - if ( ' ' === evt.key ) { - evt.preventDefault(); // Stop the details element from toggling. - insertSpace( evt.target ); // But make sure the space character is added. - } - } } +
+ - -
+ ); }; -const Save = ( props ) => { - const { - attributes: { summary }, - } = props; - +const Save = () => { return (
- - -
); diff --git a/src/show-hide-summary/block.json b/src/show-hide-summary/block.json new file mode 100644 index 0000000..77dc7a2 --- /dev/null +++ b/src/show-hide-summary/block.json @@ -0,0 +1,48 @@ +{ + "$schema": "https://json.schemastore.org/block.json", + "apiVersion": 2, + "name": "happyprime/show-hide-summary", + "title": "Show Hide Summary", + "textdomain": "show-hide-section-block", + "category": "widgets", + "description": "The summary element in a details section.", + "icon": "media-document", + "parent": [ "happyprime/show-hide-section" ], + "attributes": { + "summary": { + "type": "string", + "source": "html", + "selector": "summary" + } + }, + "supports": { + "anchor": true, + "align": true, + "alignWide": true, + "color": { + "background": true, + "enableContrastChecker": true, + "text": true, + "link": true, + "gradients": true + }, + "defaultStylePicker": true, + "dimensions": { + "minHeight": true + }, + "html": false, + "multiple": true, + "position": { + "sticky": false + }, + "spacing": { + "margin": true, + "padding": true + }, + "typography": { + "fontSize": true, + "lineHeight": true + } + }, + "editorScript": "file:index.js" +} diff --git a/src/show-hide-summary/index.js b/src/show-hide-summary/index.js new file mode 100644 index 0000000..6138682 --- /dev/null +++ b/src/show-hide-summary/index.js @@ -0,0 +1,46 @@ +import { registerBlockType } from '@wordpress/blocks'; +import { InnerBlocks, RichText, useBlockProps } from '@wordpress/block-editor'; +import { __ } from '@wordpress/i18n'; + +// Internal dependencies. +import metadata from './block.json'; + +const Edit = ( props ) => { + const { + attributes: { summary }, + setAttributes, + } = props; + + return ( + + { + setAttributes( { summary: value } ); + } } + /> + + ); +}; + +const Save = ( props ) => { + const { + attributes: { summary }, + } = props; + + return ( + + + + ); +}; + +// Register the block. +registerBlockType( metadata, { + edit: Edit, + save: Save, +} ); diff --git a/src/show-hide-summary/index.php b/src/show-hide-summary/index.php new file mode 100644 index 0000000..3d3b913 --- /dev/null +++ b/src/show-hide-summary/index.php @@ -0,0 +1,17 @@ + + test From 40ea1530a0507c2b318471ea1ded8866468fd802 Mon Sep 17 00:00:00 2001 From: jeremyfelt Date: Wed, 24 Jul 2024 16:45:50 -0700 Subject: [PATCH 2/8] Remove test file --- test.html | 2 -- 1 file changed, 2 deletions(-) delete mode 100644 test.html diff --git a/test.html b/test.html deleted file mode 100644 index 8927f62..0000000 --- a/test.html +++ /dev/null @@ -1,2 +0,0 @@ -
- test
From af6adcd39f8e2fa4d236f7f010d6a06cf4467510 Mon Sep 17 00:00:00 2001 From: jeremyfelt Date: Wed, 24 Jul 2024 16:46:43 -0700 Subject: [PATCH 3/8] Bump all block API versions to 3 --- build/show-hide-details/block.json | 2 +- build/show-hide-details/index.asset.php | 2 +- build/show-hide-details/index.js | 2 +- build/show-hide-group/block.json | 2 +- build/show-hide-group/index.asset.php | 2 +- build/show-hide-group/index.js | 2 +- build/show-hide-section/block.json | 2 +- build/show-hide-section/index.asset.php | 2 +- build/show-hide-section/index.js | 2 +- build/show-hide-summary/block.json | 2 +- build/show-hide-summary/index.asset.php | 2 +- build/show-hide-summary/index.js | 2 +- src/show-hide-details/block.json | 2 +- src/show-hide-group/block.json | 2 +- src/show-hide-section/block.json | 2 +- src/show-hide-summary/block.json | 2 +- 16 files changed, 16 insertions(+), 16 deletions(-) diff --git a/build/show-hide-details/block.json b/build/show-hide-details/block.json index df80b71..031afee 100644 --- a/build/show-hide-details/block.json +++ b/build/show-hide-details/block.json @@ -1,6 +1,6 @@ { "$schema": "https://json.schemastore.org/block.json", - "apiVersion": 2, + "apiVersion": 3, "name": "happyprime/show-hide-details", "title": "Show Hide Details", "textdomain": "show-hide-section-block", diff --git a/build/show-hide-details/index.asset.php b/build/show-hide-details/index.asset.php index dd1b7a4..47c984e 100644 --- a/build/show-hide-details/index.asset.php +++ b/build/show-hide-details/index.asset.php @@ -1 +1 @@ - array('wp-block-editor', 'wp-blocks', 'wp-i18n'), 'version' => '5a711bc380f8e042db4d'); + array('wp-block-editor', 'wp-blocks', 'wp-i18n'), 'version' => 'f8e755a9302508f08a71'); diff --git a/build/show-hide-details/index.js b/build/show-hide-details/index.js index 79e21fc..643fc86 100644 --- a/build/show-hide-details/index.js +++ b/build/show-hide-details/index.js @@ -1 +1 @@ -(()=>{"use strict";const e=window.wp.blocks,t=window.wp.blockEditor,i=window.wp.i18n,n=JSON.parse('{"$schema":"https://json.schemastore.org/block.json","apiVersion":2,"name":"happyprime/show-hide-details","title":"Show Hide Details","textdomain":"show-hide-section-block","category":"widgets","description":"The remaining content in a details section.","icon":"media-document","parent":["happyprime/show-hide-section"],"attributes":{},"supports":{},"editorScript":"file:index.js"}');(0,e.registerBlockType)(n,{edit:()=>{const e=[["core/paragraph",{placeholder:(0,i.__)("Remaining","show-hide-section-block")}]];return React.createElement(React.Fragment,null,React.createElement(t.InnerBlocks,{template:e,templateLock:!1}))},save:()=>React.createElement(t.InnerBlocks.Content,null)})})(); \ No newline at end of file +(()=>{"use strict";const e=window.wp.blocks,t=window.wp.blockEditor,i=window.wp.i18n,n=JSON.parse('{"$schema":"https://json.schemastore.org/block.json","apiVersion":3,"name":"happyprime/show-hide-details","title":"Show Hide Details","textdomain":"show-hide-section-block","category":"widgets","description":"The remaining content in a details section.","icon":"media-document","parent":["happyprime/show-hide-section"],"attributes":{},"supports":{},"editorScript":"file:index.js"}');(0,e.registerBlockType)(n,{edit:()=>{const e=[["core/paragraph",{placeholder:(0,i.__)("Remaining","show-hide-section-block")}]];return React.createElement(React.Fragment,null,React.createElement(t.InnerBlocks,{template:e,templateLock:!1}))},save:()=>React.createElement(t.InnerBlocks.Content,null)})})(); \ No newline at end of file diff --git a/build/show-hide-group/block.json b/build/show-hide-group/block.json index 73ba452..4c50361 100644 --- a/build/show-hide-group/block.json +++ b/build/show-hide-group/block.json @@ -1,6 +1,6 @@ { "$schema": "https://json.schemastore.org/block.json", - "apiVersion": 2, + "apiVersion": 3, "name": "happyprime/show-hide-group", "title": "Show Hide Group", "textdomain": "show-hide-section-block", diff --git a/build/show-hide-group/index.asset.php b/build/show-hide-group/index.asset.php index 1153dd0..84ef8c9 100644 --- a/build/show-hide-group/index.asset.php +++ b/build/show-hide-group/index.asset.php @@ -1 +1 @@ - array('wp-block-editor', 'wp-blocks', 'wp-components', 'wp-data', 'wp-i18n'), 'version' => 'b6fd5a6d69496c042e43'); + array('wp-block-editor', 'wp-blocks', 'wp-components', 'wp-data', 'wp-i18n'), 'version' => '70bf254dd1647cf40738'); diff --git a/build/show-hide-group/index.js b/build/show-hide-group/index.js index 648f612..1dba2ae 100644 --- a/build/show-hide-group/index.js +++ b/build/show-hide-group/index.js @@ -1 +1 @@ -(()=>{"use strict";const e=window.wp.blocks,t=window.wp.blockEditor,o=window.wp.components,l=window.wp.data,a=window.wp.i18n,i=JSON.parse('{"$schema":"https://json.schemastore.org/block.json","apiVersion":2,"name":"happyprime/show-hide-group","title":"Show Hide Group","textdomain":"show-hide-section-block","category":"widgets","description":"A group of accessible summaries that can be toggled to show or hide additional details.","icon":"hidden","attributes":{"hasToggle":{"type":"boolean","default":false}},"supports":{"align":true,"alignWide":true,"anchor":true,"color":{"background":true,"enableContrastChecker":true,"text":true,"link":true,"gradients":true},"defaultStylePicker":true,"dimensions":{"minHeight":true},"html":false,"position":{"sticky":false},"spacing":{"margin":true,"padding":true},"typography":{"fontSize":true,"lineHeight":true}},"editorScript":"file:index.js","viewScript":"file:view.js"}');(0,e.registerBlockType)(i,{edit:e=>{const{attributes:{hasToggle:i},setAttributes:n}=e,s=(0,l.useSelect)((t=>t("core/block-editor").getBlocks(e.clientId)));return React.createElement(React.Fragment,null,React.createElement(t.InspectorControls,null,React.createElement(o.PanelBody,null,React.createElement(o.ToggleControl,{label:(0,a.__)("Has open/close all toggle","show-hide-section-block"),help:i?(0,a.__)("Open/close all toggle will display.","show-hide-section-block"):(0,a.__)("Open/close all toggle will not display.","show-hide-section-block"),checked:i,onChange:e=>{n({hasToggle:e})}}))),React.createElement("div",(0,t.useBlockProps)(),i&&React.createElement("button",{className:"toggle-all","aria-expanded":"false",onClick:e=>{!1===e.target.ariaExpanded?(s.forEach((e=>{(0,l.dispatch)("core/block-editor").updateBlockAttributes(e.clientId,{isOpen:!0})})),e.target.innerText=(0,a.__)("Close all","show-hide-section-block"),e.target.ariaExpanded=!0):(s.forEach((e=>{(0,l.dispatch)("core/block-editor").updateBlockAttributes(e.clientId,{isOpen:!1})})),e.target.innerText=(0,a.__)("Open all","show-hide-section-block"),e.target.ariaExpanded=!1)}},(0,a.__)("Open all","show-hide-section-block")),React.createElement(t.InnerBlocks,{allowedBlocks:["happyprime/show-hide-section"],template:[["happyprime/show-hide-section",{}]],templateLock:!1})))},save:e=>{const{attributes:{hasToggle:o}}=e;return React.createElement("div",t.useBlockProps.save(),o&&React.createElement("button",{className:"toggle-all","aria-expanded":"false"},(0,a.__)("Open all","show-hide-section-block")),React.createElement(t.InnerBlocks.Content,null))}})})(); \ No newline at end of file +(()=>{"use strict";const e=window.wp.blocks,t=window.wp.blockEditor,o=window.wp.components,l=window.wp.data,a=window.wp.i18n,i=JSON.parse('{"$schema":"https://json.schemastore.org/block.json","apiVersion":3,"name":"happyprime/show-hide-group","title":"Show Hide Group","textdomain":"show-hide-section-block","category":"widgets","description":"A group of accessible summaries that can be toggled to show or hide additional details.","icon":"hidden","attributes":{"hasToggle":{"type":"boolean","default":false}},"supports":{"align":true,"alignWide":true,"anchor":true,"color":{"background":true,"enableContrastChecker":true,"text":true,"link":true,"gradients":true},"defaultStylePicker":true,"dimensions":{"minHeight":true},"html":false,"position":{"sticky":false},"spacing":{"margin":true,"padding":true},"typography":{"fontSize":true,"lineHeight":true}},"editorScript":"file:index.js","viewScript":"file:view.js"}');(0,e.registerBlockType)(i,{edit:e=>{const{attributes:{hasToggle:i},setAttributes:n}=e,s=(0,l.useSelect)((t=>t("core/block-editor").getBlocks(e.clientId)));return React.createElement(React.Fragment,null,React.createElement(t.InspectorControls,null,React.createElement(o.PanelBody,null,React.createElement(o.ToggleControl,{label:(0,a.__)("Has open/close all toggle","show-hide-section-block"),help:i?(0,a.__)("Open/close all toggle will display.","show-hide-section-block"):(0,a.__)("Open/close all toggle will not display.","show-hide-section-block"),checked:i,onChange:e=>{n({hasToggle:e})}}))),React.createElement("div",(0,t.useBlockProps)(),i&&React.createElement("button",{className:"toggle-all","aria-expanded":"false",onClick:e=>{!1===e.target.ariaExpanded?(s.forEach((e=>{(0,l.dispatch)("core/block-editor").updateBlockAttributes(e.clientId,{isOpen:!0})})),e.target.innerText=(0,a.__)("Close all","show-hide-section-block"),e.target.ariaExpanded=!0):(s.forEach((e=>{(0,l.dispatch)("core/block-editor").updateBlockAttributes(e.clientId,{isOpen:!1})})),e.target.innerText=(0,a.__)("Open all","show-hide-section-block"),e.target.ariaExpanded=!1)}},(0,a.__)("Open all","show-hide-section-block")),React.createElement(t.InnerBlocks,{allowedBlocks:["happyprime/show-hide-section"],template:[["happyprime/show-hide-section",{}]],templateLock:!1})))},save:e=>{const{attributes:{hasToggle:o}}=e;return React.createElement("div",t.useBlockProps.save(),o&&React.createElement("button",{className:"toggle-all","aria-expanded":"false"},(0,a.__)("Open all","show-hide-section-block")),React.createElement(t.InnerBlocks.Content,null))}})})(); \ No newline at end of file diff --git a/build/show-hide-section/block.json b/build/show-hide-section/block.json index 3e87128..84be760 100644 --- a/build/show-hide-section/block.json +++ b/build/show-hide-section/block.json @@ -1,6 +1,6 @@ { "$schema": "https://json.schemastore.org/block.json", - "apiVersion": 2, + "apiVersion": 3, "name": "happyprime/show-hide-section", "title": "Show Hide Section", "textdomain": "show-hide-section-block", diff --git a/build/show-hide-section/index.asset.php b/build/show-hide-section/index.asset.php index d383079..35956e2 100644 --- a/build/show-hide-section/index.asset.php +++ b/build/show-hide-section/index.asset.php @@ -1 +1 @@ - array('wp-block-editor', 'wp-blocks', 'wp-i18n'), 'version' => '853d9a76b86af34844fb'); + array('wp-block-editor', 'wp-blocks', 'wp-i18n'), 'version' => 'dc0a39764de0612baf40'); diff --git a/build/show-hide-section/index.js b/build/show-hide-section/index.js index d9e2fcf..5883688 100644 --- a/build/show-hide-section/index.js +++ b/build/show-hide-section/index.js @@ -1 +1 @@ -(()=>{"use strict";const e=window.wp.blocks,t=window.wp.blockEditor,i=window.wp.i18n,s=JSON.parse('{"$schema":"https://json.schemastore.org/block.json","apiVersion":2,"name":"happyprime/show-hide-section","title":"Show Hide Section","textdomain":"show-hide-section-block","category":"widgets","description":"A section of collapsible content contained in a details element with a summary.","icon":"media-document","parent":["happyprime/show-hide-group"],"attributes":{"isOpen":{"type":"boolean","default":false}},"supports":{"anchor":true,"align":true,"alignWide":true,"color":{"background":true,"enableContrastChecker":true,"text":true,"link":true,"gradients":true},"defaultStylePicker":true,"dimensions":{"minHeight":true},"html":false,"multiple":true,"position":{"sticky":false},"spacing":{"margin":true,"padding":true},"typography":{"fontSize":true,"lineHeight":true}},"editorScript":"file:index.js"}');(0,e.registerBlockType)(s,{edit:e=>{const{attributes:{isOpen:s},setAttributes:o,isSelected:a}=e,r=[["happyprime/show-hide-summary",{summary:(0,i.__)("Summary","show-hide-section-block")}],["happyprime/show-hide-details",{details:(0,i.__)("Details","show-hide-section-block")}]];return React.createElement("div",(0,t.useBlockProps)(),React.createElement(t.InnerBlocks,{template:r,allowedBlocks:["happyprime/show-hide-summary","happyprime/show-hide-details"],templateLock:"all"}))},save:()=>React.createElement("details",t.useBlockProps.save(),React.createElement(t.InnerBlocks.Content,null))})})(); \ No newline at end of file +(()=>{"use strict";const e=window.wp.blocks,t=window.wp.blockEditor,i=window.wp.i18n,s=JSON.parse('{"$schema":"https://json.schemastore.org/block.json","apiVersion":3,"name":"happyprime/show-hide-section","title":"Show Hide Section","textdomain":"show-hide-section-block","category":"widgets","description":"A section of collapsible content contained in a details element with a summary.","icon":"media-document","parent":["happyprime/show-hide-group"],"attributes":{"isOpen":{"type":"boolean","default":false}},"supports":{"anchor":true,"align":true,"alignWide":true,"color":{"background":true,"enableContrastChecker":true,"text":true,"link":true,"gradients":true},"defaultStylePicker":true,"dimensions":{"minHeight":true},"html":false,"multiple":true,"position":{"sticky":false},"spacing":{"margin":true,"padding":true},"typography":{"fontSize":true,"lineHeight":true}},"editorScript":"file:index.js"}');(0,e.registerBlockType)(s,{edit:e=>{const{attributes:{isOpen:s},setAttributes:o,isSelected:a}=e,r=[["happyprime/show-hide-summary",{summary:(0,i.__)("Summary","show-hide-section-block")}],["happyprime/show-hide-details",{details:(0,i.__)("Details","show-hide-section-block")}]];return React.createElement("div",(0,t.useBlockProps)(),React.createElement(t.InnerBlocks,{template:r,allowedBlocks:["happyprime/show-hide-summary","happyprime/show-hide-details"],templateLock:"all"}))},save:()=>React.createElement("details",t.useBlockProps.save(),React.createElement(t.InnerBlocks.Content,null))})})(); \ No newline at end of file diff --git a/build/show-hide-summary/block.json b/build/show-hide-summary/block.json index 77dc7a2..c6e2d52 100644 --- a/build/show-hide-summary/block.json +++ b/build/show-hide-summary/block.json @@ -1,6 +1,6 @@ { "$schema": "https://json.schemastore.org/block.json", - "apiVersion": 2, + "apiVersion": 3, "name": "happyprime/show-hide-summary", "title": "Show Hide Summary", "textdomain": "show-hide-section-block", diff --git a/build/show-hide-summary/index.asset.php b/build/show-hide-summary/index.asset.php index ed5f594..cfe57c0 100644 --- a/build/show-hide-summary/index.asset.php +++ b/build/show-hide-summary/index.asset.php @@ -1 +1 @@ - array('wp-block-editor', 'wp-blocks', 'wp-i18n'), 'version' => '04057dc363b78e5e8fa1'); + array('wp-block-editor', 'wp-blocks', 'wp-i18n'), 'version' => '10db6c2a73bed31cef63'); diff --git a/build/show-hide-summary/index.js b/build/show-hide-summary/index.js index a4e7b4a..aa69c4c 100644 --- a/build/show-hide-summary/index.js +++ b/build/show-hide-summary/index.js @@ -1 +1 @@ -(()=>{"use strict";const e=window.wp.blocks,t=window.wp.blockEditor,r=window.wp.i18n,i=JSON.parse('{"$schema":"https://json.schemastore.org/block.json","apiVersion":2,"name":"happyprime/show-hide-summary","title":"Show Hide Summary","textdomain":"show-hide-section-block","category":"widgets","description":"The summary element in a details section.","icon":"media-document","parent":["happyprime/show-hide-section"],"attributes":{"summary":{"type":"string","source":"html","selector":"summary"}},"supports":{"anchor":true,"align":true,"alignWide":true,"color":{"background":true,"enableContrastChecker":true,"text":true,"link":true,"gradients":true},"defaultStylePicker":true,"dimensions":{"minHeight":true},"html":false,"multiple":true,"position":{"sticky":false},"spacing":{"margin":true,"padding":true},"typography":{"fontSize":true,"lineHeight":true}},"editorScript":"file:index.js"}');(0,e.registerBlockType)(i,{edit:e=>{const{attributes:{summary:i},setAttributes:s}=e;return React.createElement("summary",(0,t.useBlockProps)(),React.createElement(t.RichText,{tagName:"div",label:(0,r.__)("Summary","show-hide-section-block"),placeholder:(0,r.__)("Summary","show-hide-section-block"),value:i,allowedFormats:["core/bold","core/italic"],onChange:e=>{s({summary:e})}}))},save:e=>{const{attributes:{summary:r}}=e;return React.createElement("summary",t.useBlockProps.save(),React.createElement(t.RichText.Content,{tag:"summary",value:r}))}})})(); \ No newline at end of file +(()=>{"use strict";const e=window.wp.blocks,t=window.wp.blockEditor,r=window.wp.i18n,i=JSON.parse('{"$schema":"https://json.schemastore.org/block.json","apiVersion":3,"name":"happyprime/show-hide-summary","title":"Show Hide Summary","textdomain":"show-hide-section-block","category":"widgets","description":"The summary element in a details section.","icon":"media-document","parent":["happyprime/show-hide-section"],"attributes":{"summary":{"type":"string","source":"html","selector":"summary"}},"supports":{"anchor":true,"align":true,"alignWide":true,"color":{"background":true,"enableContrastChecker":true,"text":true,"link":true,"gradients":true},"defaultStylePicker":true,"dimensions":{"minHeight":true},"html":false,"multiple":true,"position":{"sticky":false},"spacing":{"margin":true,"padding":true},"typography":{"fontSize":true,"lineHeight":true}},"editorScript":"file:index.js"}');(0,e.registerBlockType)(i,{edit:e=>{const{attributes:{summary:i},setAttributes:s}=e;return React.createElement("summary",(0,t.useBlockProps)(),React.createElement(t.RichText,{tagName:"div",label:(0,r.__)("Summary","show-hide-section-block"),placeholder:(0,r.__)("Summary","show-hide-section-block"),value:i,allowedFormats:["core/bold","core/italic"],onChange:e=>{s({summary:e})}}))},save:e=>{const{attributes:{summary:r}}=e;return React.createElement("summary",t.useBlockProps.save(),React.createElement(t.RichText.Content,{tag:"summary",value:r}))}})})(); \ No newline at end of file diff --git a/src/show-hide-details/block.json b/src/show-hide-details/block.json index df80b71..031afee 100644 --- a/src/show-hide-details/block.json +++ b/src/show-hide-details/block.json @@ -1,6 +1,6 @@ { "$schema": "https://json.schemastore.org/block.json", - "apiVersion": 2, + "apiVersion": 3, "name": "happyprime/show-hide-details", "title": "Show Hide Details", "textdomain": "show-hide-section-block", diff --git a/src/show-hide-group/block.json b/src/show-hide-group/block.json index 73ba452..4c50361 100644 --- a/src/show-hide-group/block.json +++ b/src/show-hide-group/block.json @@ -1,6 +1,6 @@ { "$schema": "https://json.schemastore.org/block.json", - "apiVersion": 2, + "apiVersion": 3, "name": "happyprime/show-hide-group", "title": "Show Hide Group", "textdomain": "show-hide-section-block", diff --git a/src/show-hide-section/block.json b/src/show-hide-section/block.json index 3e87128..84be760 100644 --- a/src/show-hide-section/block.json +++ b/src/show-hide-section/block.json @@ -1,6 +1,6 @@ { "$schema": "https://json.schemastore.org/block.json", - "apiVersion": 2, + "apiVersion": 3, "name": "happyprime/show-hide-section", "title": "Show Hide Section", "textdomain": "show-hide-section-block", diff --git a/src/show-hide-summary/block.json b/src/show-hide-summary/block.json index 77dc7a2..c6e2d52 100644 --- a/src/show-hide-summary/block.json +++ b/src/show-hide-summary/block.json @@ -1,6 +1,6 @@ { "$schema": "https://json.schemastore.org/block.json", - "apiVersion": 2, + "apiVersion": 3, "name": "happyprime/show-hide-summary", "title": "Show Hide Summary", "textdomain": "show-hide-section-block", From eb8b58a31449360ccff4bcdcd035fc4397d736fa Mon Sep 17 00:00:00 2001 From: jeremyfelt Date: Wed, 24 Jul 2024 16:47:05 -0700 Subject: [PATCH 4/8] Apply prettier via eslint --- src/show-hide-details/index.js | 19 ++++++++----------- src/show-hide-group/index.js | 7 +------ src/show-hide-section/index.js | 24 ++++++++++++++++-------- src/show-hide-summary/index.js | 28 ++++++++++++++-------------- 4 files changed, 39 insertions(+), 39 deletions(-) diff --git a/src/show-hide-details/index.js b/src/show-hide-details/index.js index 14abf97..572c1bb 100644 --- a/src/show-hide-details/index.js +++ b/src/show-hide-details/index.js @@ -6,29 +6,26 @@ import { __ } from '@wordpress/i18n'; import metadata from './block.json'; const Edit = () => { - const TEMPLATE = [ - [ 'core/paragraph', { placeholder: __( 'Remaining', 'show-hide-section-block' ) } ], + [ + 'core/paragraph', + { placeholder: __('Remaining', 'show-hide-section-block') }, + ], ]; return ( <> - + ); }; const Save = () => { - return ( - - ); + return ; }; // Register the block. -registerBlockType( metadata, { +registerBlockType(metadata, { edit: Edit, save: Save, -} ); +}); diff --git a/src/show-hide-group/index.js b/src/show-hide-group/index.js index 170e52b..da59e2c 100644 --- a/src/show-hide-group/index.js +++ b/src/show-hide-group/index.js @@ -88,12 +88,7 @@ const Edit = (props) => { )} diff --git a/src/show-hide-section/index.js b/src/show-hide-section/index.js index 3edca32..9872d7e 100644 --- a/src/show-hide-section/index.js +++ b/src/show-hide-section/index.js @@ -14,19 +14,27 @@ const Edit = (props) => { // Create an inner blocks template for the content. const TEMPLATE = [ - [ 'happyprime/show-hide-summary', { summary: __( 'Summary', 'show-hide-section-block' ) } ], - [ 'happyprime/show-hide-details', { details: __( 'Details', 'show-hide-section-block' ) } ], + [ + 'happyprime/show-hide-summary', + { summary: __('Summary', 'show-hide-section-block') }, + ], + [ + 'happyprime/show-hide-details', + { details: __('Details', 'show-hide-section-block') }, + ], ]; // Does this block have focus? - return ( -
+
); @@ -34,7 +42,7 @@ const Edit = (props) => { const Save = () => { return ( -
+
); diff --git a/src/show-hide-summary/index.js b/src/show-hide-summary/index.js index 6138682..0bb0efd 100644 --- a/src/show-hide-summary/index.js +++ b/src/show-hide-summary/index.js @@ -5,42 +5,42 @@ import { __ } from '@wordpress/i18n'; // Internal dependencies. import metadata from './block.json'; -const Edit = ( props ) => { +const Edit = (props) => { const { attributes: { summary }, setAttributes, } = props; return ( - + { - setAttributes( { summary: value } ); - } } + label={__('Summary', 'show-hide-section-block')} + placeholder={__('Summary', 'show-hide-section-block')} + value={summary} + allowedFormats={['core/bold', 'core/italic']} + onChange={(value) => { + setAttributes({ summary: value }); + }} /> ); }; -const Save = ( props ) => { +const Save = (props) => { const { attributes: { summary }, } = props; return ( - - + + ); }; // Register the block. -registerBlockType( metadata, { +registerBlockType(metadata, { edit: Edit, save: Save, -} ); +}); From 469adc76c97bf92b95590485229dae84de0a42c8 Mon Sep 17 00:00:00 2001 From: jeremyfelt Date: Tue, 5 Nov 2024 14:26:31 -0800 Subject: [PATCH 5/8] Remove unused imports in blocks --- src/show-hide-details/index.js | 2 +- src/show-hide-section/index.js | 2 +- src/show-hide-summary/index.js | 2 +- 3 files changed, 3 insertions(+), 3 deletions(-) diff --git a/src/show-hide-details/index.js b/src/show-hide-details/index.js index 572c1bb..850cd34 100644 --- a/src/show-hide-details/index.js +++ b/src/show-hide-details/index.js @@ -1,5 +1,5 @@ import { registerBlockType } from '@wordpress/blocks'; -import { InnerBlocks, RichText, useBlockProps } from '@wordpress/block-editor'; +import { InnerBlocks } from '@wordpress/block-editor'; import { __ } from '@wordpress/i18n'; // Internal dependencies. diff --git a/src/show-hide-section/index.js b/src/show-hide-section/index.js index 607fd14..26a8163 100644 --- a/src/show-hide-section/index.js +++ b/src/show-hide-section/index.js @@ -1,5 +1,5 @@ import { registerBlockType } from '@wordpress/blocks'; -import { InnerBlocks, RichText, useBlockProps } from '@wordpress/block-editor'; +import { InnerBlocks, useBlockProps } from '@wordpress/block-editor'; import { __ } from '@wordpress/i18n'; // Internal dependencies. diff --git a/src/show-hide-summary/index.js b/src/show-hide-summary/index.js index 0bb0efd..bb0249e 100644 --- a/src/show-hide-summary/index.js +++ b/src/show-hide-summary/index.js @@ -1,5 +1,5 @@ import { registerBlockType } from '@wordpress/blocks'; -import { InnerBlocks, RichText, useBlockProps } from '@wordpress/block-editor'; +import { RichText, useBlockProps } from '@wordpress/block-editor'; import { __ } from '@wordpress/i18n'; // Internal dependencies. From d01f4f5d24e8d5171dfab47baa4fe78aaca68f6c Mon Sep 17 00:00:00 2001 From: jeremyfelt Date: Tue, 5 Nov 2024 14:28:59 -0800 Subject: [PATCH 6/8] Update POT file --- languages/show-hide-section-block.pot | 101 +++++++++++++++++++------- 1 file changed, 73 insertions(+), 28 deletions(-) diff --git a/languages/show-hide-section-block.pot b/languages/show-hide-section-block.pot index 3e7da86..d953fb9 100644 --- a/languages/show-hide-section-block.pot +++ b/languages/show-hide-section-block.pot @@ -1,88 +1,133 @@ -# Copyright (C) 2023 Happy Prime +# Copyright (C) 2024 Happy Prime # This file is distributed under the same license as the Show / Hide Section Block plugin. msgid "" msgstr "" -"Project-Id-Version: Show / Hide Section Block 2.0.0\n" +"Project-Id-Version: Show / Hide Section Block 2.0.3\n" "Report-Msgid-Bugs-To: https://wordpress.org/support/plugin/show-hide-section-block\n" "Last-Translator: FULL NAME \n" "Language-Team: LANGUAGE \n" "MIME-Version: 1.0\n" "Content-Type: text/plain; charset=UTF-8\n" "Content-Transfer-Encoding: 8bit\n" -"POT-Creation-Date: 2023-03-03T16:41:52+00:00\n" +"POT-Creation-Date: 2024-11-05T22:28:28+00:00\n" "PO-Revision-Date: YEAR-MO-DA HO:MI+ZONE\n" -"X-Generator: WP-CLI 2.6.0\n" +"X-Generator: WP-CLI 2.10.0\n" "X-Domain: show-hide-section-block\n" #. Plugin Name of the plugin +#: plugin.php msgid "Show / Hide Section Block" msgstr "" #. Plugin URI of the plugin -msgid "https://github.com/happyprime/show-hide-section" +#: plugin.php +msgid "https://wordpress.org/plugins/show-hide-section-block/" msgstr "" #. Description of the plugin +#: plugin.php msgid "Display an accessible show/hide interface with details and summary elements." msgstr "" #. Author of the plugin +#: plugin.php msgid "Happy Prime" msgstr "" #. Author URI of the plugin +#: plugin.php msgid "https://happyprime.co/" msgstr "" -#: blocks/show-hide-group/index.js:37 -#: build/show-hide-group.js:1 -msgid "Close all" -msgstr "" - -#: blocks/show-hide-group/index.js:47 -#: blocks/show-hide-group/index.js:86 -#: blocks/show-hide-group/index.js:119 -#: build/show-hide-group.js:1 -msgid "Open all" +#: build/show-hide-details/index.js:1 +#: src/show-hide-details/index.js:12 +msgid "Remaining" msgstr "" -#: blocks/show-hide-group/index.js:57 -#: build/show-hide-group.js:1 +#: build/show-hide-group/index.js:1 +#: src/show-hide-group/index.js:57 msgid "Has open/close all toggle" msgstr "" -#: blocks/show-hide-group/index.js:63 -#: build/show-hide-group.js:1 +#: build/show-hide-group/index.js:1 +#: src/show-hide-group/index.js:63 msgid "Open/close all toggle will display." msgstr "" -#: blocks/show-hide-group/index.js:67 -#: build/show-hide-group.js:1 +#: build/show-hide-group/index.js:1 +#: src/show-hide-group/index.js:67 msgid "Open/close all toggle will not display." msgstr "" -#: blocks/show-hide-section/index.js:37 -#: blocks/show-hide-section/index.js:38 -#: build/show-hide-section.js:1 +#: build/show-hide-group/index.js:1 +#: src/show-hide-group/index.js:37 +msgid "Close all" +msgstr "" + +#: build/show-hide-group/index.js:1 +#: src/show-hide-group/index.js:47 +#: src/show-hide-group/index.js:86 +#: src/show-hide-group/index.js:108 +msgid "Open all" +msgstr "" + +#: build/show-hide-section/index.js:1 +#: build/show-hide-summary/index.js:1 +#: src/show-hide-section/index.js:19 +#: src/show-hide-summary/index.js:18 +#: src/show-hide-summary/index.js:19 msgid "Summary" msgstr "" -#: blocks/show-hide-group/block.json +#: build/show-hide-section/index.js:1 +#: src/show-hide-section/index.js:23 +msgid "Details" +msgstr "" + +#: build/show-hide-details/block.json +#: src/show-hide-details/block.json +msgctxt "block title" +msgid "Show Hide Details" +msgstr "" + +#: build/show-hide-details/block.json +#: src/show-hide-details/block.json +msgctxt "block description" +msgid "The remaining content in a details section." +msgstr "" + +#: build/show-hide-group/block.json +#: src/show-hide-group/block.json msgctxt "block title" msgid "Show Hide Group" msgstr "" -#: blocks/show-hide-group/block.json +#: build/show-hide-group/block.json +#: src/show-hide-group/block.json msgctxt "block description" msgid "A group of accessible summaries that can be toggled to show or hide additional details." msgstr "" -#: blocks/show-hide-section/block.json +#: build/show-hide-section/block.json +#: src/show-hide-section/block.json msgctxt "block title" msgid "Show Hide Section" msgstr "" -#: blocks/show-hide-section/block.json +#: build/show-hide-section/block.json +#: src/show-hide-section/block.json msgctxt "block description" msgid "A section of collapsible content contained in a details element with a summary." msgstr "" + +#: build/show-hide-summary/block.json +#: src/show-hide-summary/block.json +msgctxt "block title" +msgid "Show Hide Summary" +msgstr "" + +#: build/show-hide-summary/block.json +#: src/show-hide-summary/block.json +msgctxt "block description" +msgid "The summary element in a details section." +msgstr "" From 098885869a0b8456d5af2a194085e240a511a0e9 Mon Sep 17 00:00:00 2001 From: jeremyfelt Date: Tue, 5 Nov 2024 16:19:38 -0800 Subject: [PATCH 7/8] Add deprecation routine for previous iteration of block markup --- build/show-hide-section/index.asset.php | 2 +- build/show-hide-section/index.js | 2 +- src/show-hide-section/deprecated.js | 54 +++++++++++++++++++++++++ src/show-hide-section/index.js | 2 + 4 files changed, 58 insertions(+), 2 deletions(-) create mode 100644 src/show-hide-section/deprecated.js diff --git a/build/show-hide-section/index.asset.php b/build/show-hide-section/index.asset.php index 35956e2..aac6ade 100644 --- a/build/show-hide-section/index.asset.php +++ b/build/show-hide-section/index.asset.php @@ -1 +1 @@ - array('wp-block-editor', 'wp-blocks', 'wp-i18n'), 'version' => 'dc0a39764de0612baf40'); + array('wp-block-editor', 'wp-blocks', 'wp-i18n'), 'version' => '11fe62fbfeb17f1144ce'); diff --git a/build/show-hide-section/index.js b/build/show-hide-section/index.js index 5883688..4056f8f 100644 --- a/build/show-hide-section/index.js +++ b/build/show-hide-section/index.js @@ -1 +1 @@ -(()=>{"use strict";const e=window.wp.blocks,t=window.wp.blockEditor,i=window.wp.i18n,s=JSON.parse('{"$schema":"https://json.schemastore.org/block.json","apiVersion":3,"name":"happyprime/show-hide-section","title":"Show Hide Section","textdomain":"show-hide-section-block","category":"widgets","description":"A section of collapsible content contained in a details element with a summary.","icon":"media-document","parent":["happyprime/show-hide-group"],"attributes":{"isOpen":{"type":"boolean","default":false}},"supports":{"anchor":true,"align":true,"alignWide":true,"color":{"background":true,"enableContrastChecker":true,"text":true,"link":true,"gradients":true},"defaultStylePicker":true,"dimensions":{"minHeight":true},"html":false,"multiple":true,"position":{"sticky":false},"spacing":{"margin":true,"padding":true},"typography":{"fontSize":true,"lineHeight":true}},"editorScript":"file:index.js"}');(0,e.registerBlockType)(s,{edit:e=>{const{attributes:{isOpen:s},setAttributes:o,isSelected:a}=e,r=[["happyprime/show-hide-summary",{summary:(0,i.__)("Summary","show-hide-section-block")}],["happyprime/show-hide-details",{details:(0,i.__)("Details","show-hide-section-block")}]];return React.createElement("div",(0,t.useBlockProps)(),React.createElement(t.InnerBlocks,{template:r,allowedBlocks:["happyprime/show-hide-summary","happyprime/show-hide-details"],templateLock:"all"}))},save:()=>React.createElement("details",t.useBlockProps.save(),React.createElement(t.InnerBlocks.Content,null))})})(); \ No newline at end of file +(()=>{"use strict";const e=window.wp.blocks,t=window.wp.blockEditor,s=window.wp.i18n,i=JSON.parse('{"$schema":"https://json.schemastore.org/block.json","apiVersion":3,"name":"happyprime/show-hide-section","title":"Show Hide Section","textdomain":"show-hide-section-block","category":"widgets","description":"A section of collapsible content contained in a details element with a summary.","icon":"media-document","parent":["happyprime/show-hide-group"],"attributes":{"isOpen":{"type":"boolean","default":false}},"supports":{"anchor":true,"align":true,"alignWide":true,"color":{"background":true,"enableContrastChecker":true,"text":true,"link":true,"gradients":true},"defaultStylePicker":true,"dimensions":{"minHeight":true},"html":false,"multiple":true,"position":{"sticky":false},"spacing":{"margin":true,"padding":true},"typography":{"fontSize":true,"lineHeight":true}},"editorScript":"file:index.js"}'),a=[{attributes:{summary:{type:"string",source:"html",selector:"summary"}},save:({attributes:e})=>React.createElement("details",t.useBlockProps.save(),React.createElement("summary",null,e.summary),React.createElement(t.InnerBlocks.Content,null)),migrate:(t,s)=>[{},[(0,e.createBlock)("happyprime/show-hide-summary",{summary:t.summary}),(0,e.createBlock)("happyprime/show-hide-details",{},s)]],supports:{html:!0},isEligible:({summary:e})=>"string"==typeof e&&e.length>0}];(0,e.registerBlockType)(i,{edit:e=>{const{attributes:{isOpen:i},setAttributes:a,isSelected:r}=e,o=[["happyprime/show-hide-summary",{summary:(0,s.__)("Summary","show-hide-section-block")}],["happyprime/show-hide-details",{details:(0,s.__)("Details","show-hide-section-block")}]];return React.createElement("div",(0,t.useBlockProps)(),React.createElement(t.InnerBlocks,{template:o,allowedBlocks:["happyprime/show-hide-summary","happyprime/show-hide-details"],templateLock:"all"}))},save:()=>React.createElement("details",t.useBlockProps.save(),React.createElement(t.InnerBlocks.Content,null)),deprecated:a})})(); \ No newline at end of file diff --git a/src/show-hide-section/deprecated.js b/src/show-hide-section/deprecated.js new file mode 100644 index 0000000..16353af --- /dev/null +++ b/src/show-hide-section/deprecated.js @@ -0,0 +1,54 @@ +import { createBlock } from '@wordpress/blocks'; +import { InnerBlocks, useBlockProps } from '@wordpress/block-editor'; + +/** + * Deprecate the block markup provided with Show Hide Section 2.x.x. + * + * The original markup did not split the summary and details into separate + * blocks and relied on entering content directly into the summary tag. + * + * This caused issues when using the space bar to enter spaces in the summary + * content. The key press would be registered as an opening of the details tag + * instead and our override would slow down the editor experience. + * + * Now, we wrap summary and details content into separate blocks so that we + * can improve the editing experience and provide more formatting options around + * these individual tags. + */ +const v2 = { + attributes: { + summary: { + type: 'string', + source: 'html', + selector: 'summary', + }, + }, + save({ attributes }) { + return ( +
+ {attributes.summary} + +
+ ); + }, + migrate(attributes, innerBlocks) { + const newInnerBlocks = [ + // The existing summary content is moved to a summary block. + createBlock('happyprime/show-hide-summary', { + summary: attributes.summary, + }), + // All existing inner blocks are moved to a details block. + createBlock('happyprime/show-hide-details', {}, innerBlocks), + ]; + + return [{}, newInnerBlocks]; + }, + supports: { + html: true, + }, + isEligible({ summary }) { + return typeof summary === 'string' && summary.length > 0; + }, +}; + +export default [v2]; diff --git a/src/show-hide-section/index.js b/src/show-hide-section/index.js index 26a8163..7e50f8e 100644 --- a/src/show-hide-section/index.js +++ b/src/show-hide-section/index.js @@ -4,6 +4,7 @@ import { __ } from '@wordpress/i18n'; // Internal dependencies. import metadata from './block.json'; +import deprecated from './deprecated'; const Edit = (props) => { const { @@ -50,4 +51,5 @@ const Save = () => { registerBlockType(metadata, { edit: Edit, save: Save, + deprecated, }); From 7871fb7c6dfcb452dd7fa1727db95b318f186d34 Mon Sep 17 00:00:00 2001 From: jeremyfelt Date: Tue, 5 Nov 2024 16:50:57 -0800 Subject: [PATCH 8/8] Add anchor support to deprecation --- build/show-hide-section/index.asset.php | 2 +- build/show-hide-section/index.js | 2 +- src/show-hide-section/deprecated.js | 1 + 3 files changed, 3 insertions(+), 2 deletions(-) diff --git a/build/show-hide-section/index.asset.php b/build/show-hide-section/index.asset.php index aac6ade..4d7cad4 100644 --- a/build/show-hide-section/index.asset.php +++ b/build/show-hide-section/index.asset.php @@ -1 +1 @@ - array('wp-block-editor', 'wp-blocks', 'wp-i18n'), 'version' => '11fe62fbfeb17f1144ce'); + array('wp-block-editor', 'wp-blocks', 'wp-i18n'), 'version' => 'beb08742a35f54543878'); diff --git a/build/show-hide-section/index.js b/build/show-hide-section/index.js index 4056f8f..9435ea2 100644 --- a/build/show-hide-section/index.js +++ b/build/show-hide-section/index.js @@ -1 +1 @@ -(()=>{"use strict";const e=window.wp.blocks,t=window.wp.blockEditor,s=window.wp.i18n,i=JSON.parse('{"$schema":"https://json.schemastore.org/block.json","apiVersion":3,"name":"happyprime/show-hide-section","title":"Show Hide Section","textdomain":"show-hide-section-block","category":"widgets","description":"A section of collapsible content contained in a details element with a summary.","icon":"media-document","parent":["happyprime/show-hide-group"],"attributes":{"isOpen":{"type":"boolean","default":false}},"supports":{"anchor":true,"align":true,"alignWide":true,"color":{"background":true,"enableContrastChecker":true,"text":true,"link":true,"gradients":true},"defaultStylePicker":true,"dimensions":{"minHeight":true},"html":false,"multiple":true,"position":{"sticky":false},"spacing":{"margin":true,"padding":true},"typography":{"fontSize":true,"lineHeight":true}},"editorScript":"file:index.js"}'),a=[{attributes:{summary:{type:"string",source:"html",selector:"summary"}},save:({attributes:e})=>React.createElement("details",t.useBlockProps.save(),React.createElement("summary",null,e.summary),React.createElement(t.InnerBlocks.Content,null)),migrate:(t,s)=>[{},[(0,e.createBlock)("happyprime/show-hide-summary",{summary:t.summary}),(0,e.createBlock)("happyprime/show-hide-details",{},s)]],supports:{html:!0},isEligible:({summary:e})=>"string"==typeof e&&e.length>0}];(0,e.registerBlockType)(i,{edit:e=>{const{attributes:{isOpen:i},setAttributes:a,isSelected:r}=e,o=[["happyprime/show-hide-summary",{summary:(0,s.__)("Summary","show-hide-section-block")}],["happyprime/show-hide-details",{details:(0,s.__)("Details","show-hide-section-block")}]];return React.createElement("div",(0,t.useBlockProps)(),React.createElement(t.InnerBlocks,{template:o,allowedBlocks:["happyprime/show-hide-summary","happyprime/show-hide-details"],templateLock:"all"}))},save:()=>React.createElement("details",t.useBlockProps.save(),React.createElement(t.InnerBlocks.Content,null)),deprecated:a})})(); \ No newline at end of file +(()=>{"use strict";const e=window.wp.blocks,t=window.wp.blockEditor,s=window.wp.i18n,i=JSON.parse('{"$schema":"https://json.schemastore.org/block.json","apiVersion":3,"name":"happyprime/show-hide-section","title":"Show Hide Section","textdomain":"show-hide-section-block","category":"widgets","description":"A section of collapsible content contained in a details element with a summary.","icon":"media-document","parent":["happyprime/show-hide-group"],"attributes":{"isOpen":{"type":"boolean","default":false}},"supports":{"anchor":true,"align":true,"alignWide":true,"color":{"background":true,"enableContrastChecker":true,"text":true,"link":true,"gradients":true},"defaultStylePicker":true,"dimensions":{"minHeight":true},"html":false,"multiple":true,"position":{"sticky":false},"spacing":{"margin":true,"padding":true},"typography":{"fontSize":true,"lineHeight":true}},"editorScript":"file:index.js"}'),a=[{attributes:{summary:{type:"string",source:"html",selector:"summary"}},save:({attributes:e})=>React.createElement("details",t.useBlockProps.save(),React.createElement("summary",null,e.summary),React.createElement(t.InnerBlocks.Content,null)),migrate:(t,s)=>[{},[(0,e.createBlock)("happyprime/show-hide-summary",{summary:t.summary}),(0,e.createBlock)("happyprime/show-hide-details",{},s)]],supports:{html:!0,anchor:!0},isEligible:({summary:e})=>"string"==typeof e&&e.length>0}];(0,e.registerBlockType)(i,{edit:e=>{const{attributes:{isOpen:i},setAttributes:a,isSelected:r}=e,o=[["happyprime/show-hide-summary",{summary:(0,s.__)("Summary","show-hide-section-block")}],["happyprime/show-hide-details",{details:(0,s.__)("Details","show-hide-section-block")}]];return React.createElement("div",(0,t.useBlockProps)(),React.createElement(t.InnerBlocks,{template:o,allowedBlocks:["happyprime/show-hide-summary","happyprime/show-hide-details"],templateLock:"all"}))},save:()=>React.createElement("details",t.useBlockProps.save(),React.createElement(t.InnerBlocks.Content,null)),deprecated:a})})(); \ No newline at end of file diff --git a/src/show-hide-section/deprecated.js b/src/show-hide-section/deprecated.js index 16353af..35751eb 100644 --- a/src/show-hide-section/deprecated.js +++ b/src/show-hide-section/deprecated.js @@ -45,6 +45,7 @@ const v2 = { }, supports: { html: true, + anchor: true, }, isEligible({ summary }) { return typeof summary === 'string' && summary.length > 0;