-
Notifications
You must be signed in to change notification settings - Fork 4.2k
New issue
Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.
By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.
Already on GitHub? Sign in to your account
Blocks: add "Button" #616
Blocks: add "Button" #616
Conversation
I dig this a lot. The link on the right works well, it would be good to get this merged in and tested so we can really feel it. It doesn't work too well responsively though. Otherwise, thumbs up! |
I am not sure about the markup here; ended up adding a wrapping div so alignment worked more precisely. |
/> | ||
{ focus && | ||
<form | ||
className="editable-format-toolbar__link-modal" |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
This should be a component like Editable
so we don't rely on reusing classes.
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
It would also simplify the interface for developers.
url: attr( 'a', 'href' ), | ||
title: attr( 'a', 'title' ), | ||
text: children( 'a' ), | ||
align: ( node ) => ( node.className.match( /\balign(\S+)/ ) || [] )[ 1 ] |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
@aduth what's the latest on this?
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Render link outside the button. Allow opening button link externally. Disable focusing.
This uses the default link-modal implemented for Editable, but displays it all the time. Positioninig is determined by block alignment. Position URL input to the left when button is aligned right.
* @param {string} align Alignment value | ||
* @return {Function} Attribute setter | ||
*/ | ||
function applyOrUnset( align ) { |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Per @iseulde's comment at #401 (comment), maybe there's value in allowing the control to be associated with an attribute to toggle, even just as an optional convenience.
Also, this has since been renamed in the image block as toggleAlignment
.
Button
Starts a simple block to easily add a button to a post.