fix(infield-button): updated border color for disabled state

Author: Rajdeep Chandra

.changeset/popular-trains-sniff.md

@@ -0,0 +1,5 @@
+---
+"@spectrum-css/infieldbutton": patch
+---
+
+updated infield button disabled border color for spectrum-two theme

components/infieldbutton/dist/metadata.json

@@ -132,6 +132,7 @@
     "--spectrum-disabled-content-color",
     "--spectrum-gray-100",
     "--spectrum-gray-200",
+    "--spectrum-gray-300",
     "--spectrum-neutral-content-color-default",
     "--spectrum-neutral-content-color-down",
     "--spectrum-neutral-content-color-hover",
@@ -146,6 +147,7 @@
     "--system-infield-button-border-radius",
     "--system-infield-button-border-radius-reset",
     "--system-infield-button-border-width",
+    "--system-infield-button-disabled-border-color",
     "--system-infield-button-stacked-bottom-border-radius-end-start",
     "--system-infield-button-stacked-top-border-radius-start-start"
   ],

components/infieldbutton/index.css

@@ -38,7 +38,7 @@
 		--mod-infield-button-background-color-hover: var(--mod-infield-button-background-color-hover-disabled, var(--spectrum-disabled-background-color));
 		--mod-infield-button-background-color-down: var(--mod-infield-button-background-color-down-disabled, var(--spectrum-disabled-background-color));
 
-		--mod-infield-button-border-color: var(--mod-infield-button-border-color-disabled, var(--spectrum-disabled-background-color));
+		--mod-infield-button-border-color: var(--mod-infield-button-border-color-disabled, var(--spectrum-infield-button-border-color));
 
 		--mod-infield-button-icon-color: var(--mod-infield-button-icon-color-disabled, var(--spectrum-disabled-content-color));
 		--mod-infield-button-icon-color-hover: var(--mod-infield-button-icon-color-hover-disabled, var(--spectrum-disabled-content-color));

components/infieldbutton/themes/spectrum-two.css

@@ -27,5 +27,9 @@
 		--spectrum-infield-button-background-color-hover: var(--spectrum-gray-200);
 		--spectrum-infield-button-background-color-down: var(--spectrum-gray-200);
 		--spectrum-infield-button-background-color-key-focus: var(--spectrum-gray-200);
+
+		&:disabled {
+			--spectrum-infield-button-border-color: var(--spectrum-gray-300);
+		}
 	}
 }

components/infieldbutton/themes/spectrum.css

@@ -21,5 +21,9 @@
 		--spectrum-infield-button-background-color-hover: var(--spectrum-gray-200);
 		--spectrum-infield-button-background-color-down: var(--spectrum-gray-300);
 		--spectrum-infield-button-background-color-key-focus: var(--spectrum-gray-200);
+
+		&:disabled {
+			--spectrum-infield-button-border-color: var(--spectrum-gray-200);
+		}
 	}
 }