feat(button): mod property for icon margin top

Add a mod property to make it easy to modify the margin-block-start of
the icon, in case of alignment issues with icons that are not the
intended workflow sizes.

Author: jawinn

components/button/index.css

@@ -155,10 +155,12 @@ governing permissions and limitations under the License.
       var(--spectrum-icon-block-size, var(--spectrum-button-intended-icon-size))
     );
 
-    margin-block-start: max(0px,
-      var(--mod-button-top-to-icon, var(--spectrum-button-top-to-icon)) - 
-      var(--mod-button-border-width, var(--spectrum-button-border-width)) +
-      (var(--_icon-size-difference, 0px) / 2)
+    margin-block-start: var(--mod-button-icon-margin-block-start,
+      max(0px,
+        var(--mod-button-top-to-icon, var(--spectrum-button-top-to-icon)) - 
+        var(--mod-button-border-width, var(--spectrum-button-border-width)) +
+        (var(--_icon-size-difference, 0px) / 2)
+      )
     );
 
     margin-inline-start: calc(

components/button/metadata/mods.md

@@ -32,6 +32,7 @@
 | `--mod-button-font-family`                 |
 | `--mod-button-font-size`                   |
 | `--mod-button-height`                      |
+| `--mod-button-icon-margin-block-start`     |
 | `--mod-button-line-height`                 |
 | `--mod-button-margin-block`                |
 | `--mod-button-margin-left`                 |