How to deselect padding & margin in the Inspector panel of your custom Gutenberg block?

[TonyNguyen137]

Hello,
I’m trying to achieve this toggle behavior for padding and margin:
https://github.com/user-attachments/assets/8f38de89-6c1a-48a4-9a14-e0504fe04be3
This is the default behavior for all built-in Gutenberg blocks.

However, it doesn’t seem to work for custom Gutenberg blocks by default.
https://github.com/user-attachments/assets/e23a5ccf-37d0-43d7-8c8d-be830aa69fe5

I am using a custom theme that is nearly empty.

Configuration Details
//theme.json - in custom-theme folder

//block.json - in plugins/custom-plugin

I might have overlooked something—is there anything else I need to configure to make this work? I am just a newbie.

Any insights would be greatly appreciated!

Thank you for your time and help! 🙌

[ALJ]

Hi @TonyNguyen137 the ability for editors to toggle individual controls is made possible by defining some as "default controls" (always visible) and others as "not default controls" (start invisible and can be toggled on). I was able to make margin and padding controls toggle on and off in the block editor on a custom block with the following in block.json:

  "supports": {
    "spacing": {
      "margin": true,
      "padding": true,
      "__experimentalDefaultControls": {
        "margin": false,
        "padding": false
      }
    }
  },

It looks like it might be stabilizing to defaultControls in #67018 ... edit: it's been un-stabilized again in #68163

[TonyNguyen137]

Thanks so much! I'll check it out when I get the chance. Just curious – how do you usually find solutions to these kinds of micro problems? Are they documented somewhere, or is it more experience and digging around?