Problem/Motivation
When adding a new menu entry, menu item form help explains how <button> and <nolink> can be used to add a button or a text without link in any menu, however, radix interprets a non renderable item.url (such as <nolink> or <button>) as <hr> :
https://git.drupalcode.org/project/radix/-/blob/6.0.x/components/dropdow...
Steps to reproduce
Add menu item and do this considering the menu form help:
Start typing the title of a piece of content to select it. You can also enter an internal path such as /node/add or an external URL such as https://example.com. Enter <front> to link to the front page. Enter <nolink> to display link text only. Enter <button> to display keyboard-accessible link text only.
Proposed resolution
What about if dropdown component adds another condition to convert it to hr and so on <nolink> and <button> is allowed?
If this is done it will be easier to set menu items as headers https://getbootstrap.com/docs/5.0/components/dropdowns/#headers e.g.
| Comment | File | Size | Author |
|---|---|---|---|
| #5 | 3518216-5-allownolink.patch | 570 bytes | aleix |
Issue fork radix-3518216
Show commands
Start within a Git clone of the project using the version control instructions.
Or, if you do not have SSH keys set up on git.drupalcode.org:
Comments
Comment #2
aleixComment #3
aleixwith this patch if item title is '-' and url is it will be converted to hr
Comment #4
aleix(patch will not apply, must be placed in /components/dropdown-menu/ ... sorry)
Comment #5
aleixUploading working patch
Comment #6
doxigo commentedThanks a lot Aleix for the patch and the issue.
I am yet to test this but I wonder if this is a proper solution for
nolinkandbutton, they will probably fall into theelsesection.the
-for the divider works I suspect but not sureThat aside, if they are meant to be a dropdown, does it need a
dropdown-headerclass maybe?Comment #7
aleix(upgraded issue description to show tags, without this is impossible to understand what I was saying... 🙏🏻)
Comment #8
aleixSure, menu items to be headers must be preprocessed or in ui with https://www.drupal.org/project/menu_link_attributes to add dropdown-header
Comment #10
aleixI think that there's no problem in falling to the else as link supports bothnolink and button urls so the only special cases are
<nolink>with title == -, and now button as I have updated the MR, covering the way how button can be rendered using our component.To be fully usable, the button in the menu needs to be treated in css too.
Comment #11
doxigo commentedI see, thanks Aleix, could you also do me a favor and update the README file of the component as well if needed in the MR?
Comment #12
aleixYes, so ¿ Do you mean adding there the notes about the use of
<nolink>together with "-" and<button>?Comment #13
doxigo commentedYes that, so I can merge and call it a day :D
Comment #14
aleixDone, maybe someday the button logic can be extended to be more accessible from dropdown component properties, maybe when someone needs it can be changed. Thank's doxigo
Comment #16
doxigo commentedYeah sounds good, we should look into that at some point, Thanks a lot for the MR 🙌