refactor(button): make edge to visual values consistent

Two of the custom properties for edge-to-visual were subtracting the
border width in its value, while a third was not and later subtracting
the border width where it was used. This adjusts the third to work the
same way.

components/button/index.css

@@ -30,9 +30,9 @@ governing permissions and limitations under the License.
   --spectrum-button-font-weight: var(--spectrum-bold-font-weight);
   --spectrum-button-font-size: var(--spectrum-font-size-100);
 
-  --spectrum-button-edge-to-visual: calc(var(--spectrum-component-pill-edge-to-visual-100) - var(--spectrum-button-border-width));
-  --spectrum-button-edge-to-visual-only: var(--spectrum-component-pill-edge-to-visual-only-100);
-  --spectrum-button-edge-to-text: calc(var(--spectrum-component-pill-edge-to-text-100) - var(--spectrum-button-border-width));
+  --spectrum-button-edge-to-visual: calc(var(--spectrum-component-pill-edge-to-visual-100) - var(--mod-button-border-width, var(--spectrum-button-border-width)));
+  --spectrum-button-edge-to-visual-only: calc(var(--spectrum-component-pill-edge-to-visual-only-100) - var(--mod-button-border-width, var(--spectrum-button-border-width)));
+  --spectrum-button-edge-to-text: calc(var(--spectrum-component-pill-edge-to-text-100) - var(--mod-button-border-width, var(--spectrum-button-border-width)));
   --spectrum-button-padding-label-to-icon: var(--spectrum-text-to-visual-100);
   --spectrum-button-top-to-text: var(--spectrum-button-top-to-text-medium);
   --spectrum-button-bottom-to-text: var(--spectrum-button-bottom-to-text-medium);
@@ -50,9 +50,9 @@ governing permissions and limitations under the License.
 
   --spectrum-button-font-size: var(--spectrum-font-size-75);
 
-  --spectrum-button-edge-to-visual: calc(var(--spectrum-component-pill-edge-to-visual-75) - var(--spectrum-button-border-width));
-  --spectrum-button-edge-to-visual-only: var(--spectrum-component-pill-edge-to-visual-only-75);
-  --spectrum-button-edge-to-text: calc(var(--spectrum-component-pill-edge-to-text-75) - var(--spectrum-button-border-width));
+  --spectrum-button-edge-to-visual: calc(var(--spectrum-component-pill-edge-to-visual-75) - var(--mod-button-border-width, var(--spectrum-button-border-width)));
+  --spectrum-button-edge-to-visual-only: calc(var(--spectrum-component-pill-edge-to-visual-only-75) - var(--mod-button-border-width, var(--spectrum-button-border-width)));
+  --spectrum-button-edge-to-text: calc(var(--spectrum-component-pill-edge-to-text-75) - var(--mod-button-border-width, var(--spectrum-button-border-width)));
   --spectrum-button-padding-label-to-icon: var(--spectrum-text-to-visual-75);
   --spectrum-button-top-to-text: var(--spectrum-button-top-to-text-small);
   --spectrum-button-bottom-to-text: var(--spectrum-button-bottom-to-text-small);
@@ -70,9 +70,9 @@ governing permissions and limitations under the License.
 
   --spectrum-button-font-size: var(--spectrum-font-size-200);
 
-  --spectrum-button-edge-to-visual: calc(var(--spectrum-component-pill-edge-to-visual-200) - var(--spectrum-button-border-width));
-  --spectrum-button-edge-to-visual-only: var(--spectrum-component-pill-edge-to-visual-only-200);
-  --spectrum-button-edge-to-text: calc(var(--spectrum-component-pill-edge-to-text-200) - var(--spectrum-button-border-width));
+  --spectrum-button-edge-to-visual: calc(var(--spectrum-component-pill-edge-to-visual-200) - var(--mod-button-border-width, var(--spectrum-button-border-width)));
+  --spectrum-button-edge-to-visual-only: calc(var(--spectrum-component-pill-edge-to-visual-only-200) - var(--mod-button-border-width, var(--spectrum-button-border-width)));
+  --spectrum-button-edge-to-text: calc(var(--spectrum-component-pill-edge-to-text-200) - var(--mod-button-border-width, var(--spectrum-button-border-width)));
   --spectrum-button-padding-label-to-icon: var(--spectrum-text-to-visual-200);
   --spectrum-button-top-to-text: var(--spectrum-button-top-to-text-large);
   --spectrum-button-bottom-to-text: var(--spectrum-button-bottom-to-text-large);
@@ -86,9 +86,9 @@ governing permissions and limitations under the License.
 
   --spectrum-button-font-size: var(--spectrum-font-size-300);
 
-  --spectrum-button-edge-to-visual: calc(var(--spectrum-component-pill-edge-to-visual-300) - var(--spectrum-button-border-width));
-  --spectrum-button-edge-to-visual-only: var(--spectrum-component-pill-edge-to-visual-only-300);
-  --spectrum-button-edge-to-text: calc(var(--spectrum-component-pill-edge-to-text-300) - var(--spectrum-button-border-width));
+  --spectrum-button-edge-to-visual: calc(var(--spectrum-component-pill-edge-to-visual-300) - var(--mod-button-border-width, var(--spectrum-button-border-width)));
+  --spectrum-button-edge-to-visual-only: calc(var(--spectrum-component-pill-edge-to-visual-only-300) - var(--mod-button-border-width, var(--spectrum-button-border-width)));
+  --spectrum-button-edge-to-text: calc(var(--spectrum-component-pill-edge-to-text-300) - var(--mod-button-border-width, var(--spectrum-button-border-width)));
   --spectrum-button-padding-label-to-icon: var(--spectrum-text-to-visual-300);
   --spectrum-button-top-to-text: var(--spectrum-button-top-to-text-extra-large);
   --spectrum-button-bottom-to-text: var(--spectrum-button-bottom-to-text-extra-large);
@@ -488,10 +488,7 @@ a.spectrum-Button {
 /* Icon only variant */
 .spectrum-Button.spectrum-Button--iconOnly {
   min-inline-size: unset;
-  padding: calc(
-    var(--mod-button-edge-to-visual-only, var(--spectrum-button-edge-to-visual-only)) -
-    var(--mod-button-border-width, var(--spectrum-button-border-width))
-  );
+  padding: var(--mod-button-edge-to-visual-only, var(--spectrum-button-edge-to-visual-only));
 
   .spectrum-Icon {
     align-self: center;