FormLayout.Group has fixed gap using BlockStack

[sethomas]

Issue summary

To build and Address Form, web is using BlockStack with a gap prop value of 400 for each field. For grouped inputs like city + state + zip we are using FormLayout and FormLayout.Group. The problem is the ungrouped fields have a 400 gap but the grouped fields have a hard coded 200 gap from Polaris.

Can we allow props to control this gap spacing?

Expected behavior

Consistent spacing controlled by not-polaris for grouped or ungrouped fields.

Actual behavior

In consistent spacing:

Steps to reproduce the problem

1. go to any Shopify web admin
2. click Customers on the left side
3. create a customer or edit a customer
4. click snowman icon and "Manage Addresses" then click the pencil icon to see the Address form
5. notice the postal code which goes to a second line has incorrect top spacing

Reduced test case

Codesandbox

Notice there is no way for me to match the grouped spacing above the 3rd item.

Specifications

• Are you using the React components? (Y/N): Y
• Polaris version number: 12.1.1
• Browser: Chrome 119.0.6045.199
• Device: Computer
• Operating System: MacOS 14.1.1