Gutenberg: Button Block: disable Border Radius slider

[dougwollison]

Is your feature request related to a problem? Please describe.
Most themes I build have a strict set of button styles, which includes a limited set of border radius options. Currently, while I can override the border radius on buttons, I can't remove the block editor panel offering the border radius slider. This can result in a confusing interface for the user who sees the slider, tries playing with it, only to find it does nothing.

Other panels like the Text Settings one (up until #19208 that is) I can at least display:none in order to hide the Drop Cap option (which still can't be disabled).

Describe the solution you'd like
The ability to, either via add_them_support() in PHP or some javascript API like unregisterBlockStyle, disable the border radius panel on buttons (or otherwise everywhere).

Describe alternatives you've considered
Another solution would be to add a classname to the panel so it can be hidden via the admin stylesheet.

[carasmo]

Yes, this is annoying. I ended up making a simple button in ACF block. And I use https://wordpress.org/plugins/disable-gutenberg-blocks/ to disable all the core blocks I don't want. Too much. I like Gutenberg for the most part.

[samhermes]

+1 on this. Just like the button gradient coming in the next release, it's so frustrating to not have control over these options. As a developer, I get requests from designers looking to lock this down, and I'm not able to do anything about it.

[dougwollison]

Just like the button gradient coming in the next release

Actually that can be disabled properly now in the next release, though only if you don't want to offer gradients anywhere else:

add_theme_support( 'editor-gradient-presets', array() );
add_theme_support( 'disable-custom-gradients' );

As for the border radius, I'm currently getting by using a filter on the blocks.registerBlockType hook and replacing the button block's edit component with a custom one that's basically a copy/paste of the original with the border radius and color options cut out. I'm doing the same for the paragraph block and it's drop-cap option. In theory it won't be too much of a hassle to maintain since I'm providing it as a private use plugin on my projects.

[andreyuv]

Hi @dougwollison

You mention:

I'm currently getting by using a filter on the blocks.registerBlockType hook and replacing the button block's edit component with a custom one ...

If possible, could you please share a code snippet? I'm facing the same problem and after a lot of reading and searching I am still having a very rough time trying to understand how to do it.

[dougwollison]

Hey @andreyuv,

If possible, could you please share a code snippet?

Unfortunately the code for all of it is kinda tied up in a private project right now, but the gist of it is this:

wp.hooks.addFilter( 'blocks.registerBlockType', 'patch-block/core-button', ( settings ) => {
    if ( settings.name = 'core/button' ) {
        lodash.assign( settings, {
            edit: NewButtonEdit,
            save: NewButtonSave,
        } );
    }
}, 0 );

The NewButtonEdit and NewButtonSave are functional components I then made that were basically copy-paste copies of the ones from the repo, but with stuff removed, and converted to run as a 3rd part script (i.e. convert stuff like import { whatever } from '@wordpress/block-editor'; to const { whatever } = wp.blockEditor;)

[andreyuv]

Thanks for taking the time to reply @dougwollison !

[skyshab]

I'd like to control the button border radius in my theme with preset block styles and remove the range control for it. Would be great if there was a way for theme developers to toggle this functionality.

[jomarieminney]

Please 👍 My clients definitely should not have the ability to adjust things like border radius... it's a great way to throw consistency out the window. An option like the add theme support, or even wp.blocks.unregisterBlockStyle would be ideal!

[soulstyle]

Yes, please! This is urgently needed, clients should not have access to this on sites with strict design guidelines.

A theme support option would be great!

[ChemicalSailor]

As well as being able to disable it, it might be nice to be able to filter the possible values to a limited set of radii.

[tomphilpotts]

Is there any update on removing these option? Really need the ability too.

[urlund]

+1 for this feature :)

[ZebulanStanphill]

Yeah, I think this is a control that, at most, should _only_ be exposed in the Global Styles UI (when that eventually becomes a thing). Changing the border radius of individual buttons is a design foot-gun, in my opinion.

[pinoceniccola]

Things like this (and other styles like gradients, font sizes, etc.) should be defined at least on a global level, using tokenized values and possibly exposed only to users with higher capabilities. We spend a lot of time trying to bring consistency in design with style guides and other visual guidelines and this kind of unrestricted and arbitrary customization throw all of our work out of the window!

Authors and editors should focus on content, not styling. Many of them are unable to take rational design decisions. Giving them the power of styling border radii or gradients on multiple buttons/elements in a random fashion on the same page, or even on the same website, is a recipe for a visual disaster.

For now, at least a filter to disable all this is really much needed. Thank you.