Add migration to increase Spacing coverage

[lgriffee]

Write a new @shopify/polaris-migrator script to increase Spacing coverage. The migration should walk the following declaration and apply passing values.

{
    "padding:",
    "padding-top:",
    "padding-right:",
    "padding-bottom:",
    "padding-left:",
    "margin:",
    "margin-top:",
    "margin-right:",
    "margin-bottom:",
    "margin-left:",
    "margin-inline-start:",
    "margin-inline-end:",
    "margin-block-start:",
    "margin-block-end:",
    "min-height:",
    "max-height:",
    "min-width:",
    "max-width:",
    "border:",
    "border-width:",
    "border-top:",
    "border-right:",
    "border-bottom:",
    "border-left:",
    "border-top-width:",
    "border-right-width:",
    "border-bottom-width:",
    "border-left-width:",
    "gap:",
    "grid-gap:",
    "row-gap:",
    "column-gap:",
    "text-indent:",
    "top:",
    "right:",
    "bottom:",
    "left:",
    "scale:",
}

Related legacy API

• spacing
• border

Related PRs

• Add migration for sass padding and margin length values #7264
• Add gap properties to replace-spacing-lengths migration #7342
• Create @shopify/polaris-migrator package #6852 – includes spacing() function migration
• Add migration to replace-border-declarations #7387

Failing lines

Review failures and determine what is possible to migrate:

• Note values that are easily replaced
• Otherwise, discuss replacement values with team

Data

• 👉 spacing failing lines grouped by property
• failing-lines-all.json
• failing-lines-categorized.json
• grouped-failing-lines-categorized.json
• sorted-failing-lines-categorized.json

[lgriffee]

Spacing Migration

Looks at all failing lines in web and polaris for spacing coverage excluding the spacing() function.

Property	Token Replacement	Repalcement Status
padding	--p-space-*	✅ migrated
padding-top	--p-space-*	✅ migrated
padding-right	--p-space-*	✅ migrated
padding-bottom	--p-space-*	✅ migrated
padding-left	--p-space-*	✅ migrated
padding-inline	--p-space-*	✅ migrated
padding-inline-start	--p-space-*	✅ migrated
padding-inline-end	--p-space-*	✅ migrated
padding-block	--p-space-*	✅ migrated
padding-block-start	--p-space-*	✅ migrated
padding-block-end	--p-space-*	✅ migrated
margin	--p-space-*	✅ migrated
margin-top	--p-space-*	✅ migrated
margin-right	--p-space-*	✅ migrated
margin-bottom	--p-space-*	✅ migrated
margin-left	--p-space-*	✅ migrated
margin-inline	--p-space-*	✅ migrated
margin-inline-start	--p-space-*	✅ migrated
margin-inline-end	--p-space-*	✅ migrated
margin-block	--p-space-*	✅ migrated
margin-block-start	--p-space-*	✅ migrated
margin-block-end	--p-space-*	✅ migrated
min-height	context dependent	🚫 not creating migration
max-height	context dependent	🚫 not creating migration
min-width	context dependent	🚫 not creating migration
max-width	context dependent	🚫 not creating migration
border	--p-border-width-*	✅ migrated
border-width	--p-border-width-*	✅ migrated
border-top	--p-border-width-*	✅ migrated
border-right	--p-border-width-*	✅ migrated
border-bottom	--p-border-width-*	✅ migrated
border-left	--p-border-width-*	✅ migrated
border-top-width	--p-border-width-*	✅ migrated
border-right-width	--p-border-width-*	✅ migrated
border-bottom-width	--p-border-width-*	✅ migrated
border-left-width	--p-border-width-*	✅ migrated
gap	--p-space-*	✅ migrated
grid-gap	--p-space-*	✅ migrated
row-gap	--p-space-*	✅ migrated
grid-row-gap	--p-space-*	✅ migrated
column-gap	--p-space-*	✅ migrated
grid-column-gap	--p-space-*	✅ migrated
text-indent	??	🚫 not creating migration
top	context dependent	🚫 not creating migration
right	context dependent	🚫 not creating migration
bottom	context dependent	🚫 not creating migration
left	context dependent	🚫 not creating migration
scale	??	🚫 not creating migration