Implement the nested block behavior in list block v2 #39487
Merged
Conversation
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
youknowriad
added
[Block] List
youknowriad
requested review from
ajitbohra,
mkaz,
ryanwelcher and
juanmaguitar
as code owners
youknowriad
requested review from
gziolo,
jorgefilipecosta,
oandregal,
ntsekouras,
ellatrix,
mcsf and
mtias
|
Size Change: +224 B (0%) Total Size: 1.16 MB
ℹ️ View Unchanged
|
| export default function save() { | ||
| return ( | ||
| <ul { ...useBlockProps.save() }> | ||
| <InnerBlocks.Content /> |
There was a problem hiding this comment.
Could we add some checks to return null if there are no inner blocks? It is very easy to create an empty list item for the user is very hard to remove. Or maybe we can automatically remove the list block if it becomes empty?
There was a problem hiding this comment.
we should add a shortcut later that removes it on backspace
ntsekouras
reviewed
Mar 16, 2022
ntsekouras
approved these changes
Mar 16, 2022
Comment on lines
+13
to
+15
| const innerBlocksProps = useInnerBlocksProps( blockProps, { | ||
| allowedBlocks: [ 'core/list' ], | ||
| } ); |
There was a problem hiding this comment.
Nitpick: { allowedBlocks: [ 'core/list' ] } could be moved to a constant outside of the component to avoid recreating it on every render.
ellatrix
force-pushed
the
add/list-nested-blocks
branch
from
e5b0031 to
74e079f
Compare
mcsf
reviewed
Mar 18, 2022
| "content": { | ||
| "type": "string", | ||
| "source": "html", | ||
| "selector": "li", |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
Add this suggestion to a batch that can be applied as a single commit.
This suggestion is invalid because no changes were made to the code.
Suggestions cannot be applied while the pull request is closed.
Suggestions cannot be applied while viewing a subset of changes.
Only one suggestion per line can be applied in a batch.
Add this suggestion to a batch that can be applied as a single commit.
Applying suggestions on deleted lines is not supported.
You must change the existing code in this line in order to create a valid suggestion.
Outdated suggestions cannot be applied.
This suggestion has been applied or marked resolved.
Suggestions cannot be applied from pending reviews.
Suggestions cannot be applied on multi-line comments.
Suggestions cannot be applied while the pull request is queued to merge.
Suggestion cannot be applied right now. Please check back later.
Related #6394
What?
This PR implements the logic for the list block v2 (with inner blocks). It adds the base save/edit for list and list item blocks.
How?
At the moment, the block is very rough, I decided explicitly to only focus on:
There's a lot of things to be implemented here to make this block more usable, the idea is that now that we have the list block and basic behavior in place, we can potentially work in parallel if needed on some of these points:
Testing Instructions
1- Enable the "list block v2" experiment
2- Insert a list block
3- You can use appenders and such (regular inner blocks UI) to insert list items and nested lists (interaction is very rough without keyboard support)
4- Make sure the produced markup is correct.
Screen.Recording.2022-03-16.at.9.25.50.AM.mov