Block Controls: Treat alignments toolbar as an inline toolbar #533
Conversation
youknowriad
added
the
Framework
|
This seems to work great! 👍 |
|
One concern I have with this is that it's not clear why what's being formatted is being formatted. Granted, this is a problem in the current editor as well, but I was hoping we could change this. It's neither applied to the selected block, nor the text selection. |
It's applied to the paragraph block, no? I think the behavior of the current editor is okay on this front. If your cursor is inside an HTML element that has an alignment applied, the corresponding alignment button in the toolbar is pressed. |
Yeah! it's applied to the parent Is this mergeable? |
Barring any technical issues, I say go for it. And even with some technical issues, we can always revisit. Though do remember to unwind in the weekend :) |
| } | ||
|
|
||
| return result; | ||
| }, {} ); | ||
| if ( tag === 'p' ) { |
There was a problem hiding this comment.
What's the reason we restrict this to the p tag?
There was a problem hiding this comment.
This is not a restriction, that's where TinyMCE adds the alignment style. We can check in all the parent blocks, and then we'll have to decide for a priority (the closest maybe).
There was a problem hiding this comment.
This is not a restriction, that's where TinyMCE adds the alignment style.
Ah. Thinking maybe this could be the forced_root_block setting:
https://www.tinymce.com/docs/configure/content-filtering/#forced_root_block
i.e. comparing to this.editor.settings.forced_root_block instead.
As an alternative to #511, in this PR I'm treating the alignment controls as an inline toolbar (same as formats). Which means the state is inferred from the current selection. This allows per-block alignment inside blocks.
To opt-in to show the alignment toolbar, I've added a
showAlignmentsprop to theEditablecomponent.