fix(textfield): update border color on keyfocus in s2

Author: TarunAdobe

.changeset/strong-falcons-switch.md

@@ -2,4 +2,4 @@
 "@spectrum-css/textfield": patch
 ---
 
-updated border color for keyfocus and focus state and updated background and border color for default disabled state in s2
+updated border color on keyboard focus state for textfield in spectrum-two theme

.storybook/CHANGELOG.md

@@ -10,10 +10,10 @@
 
 ### Patch Changes
 
-- [#3528](https://github.com/adobe/spectrum-css/pull/3528) [`bee70fb`](https://github.com/adobe/spectrum-css/commit/bee70fbab5f12b49ce2611366b614c75277e0aa9) Thanks [@castastrophe](https://github.com/castastrophe)! 
+- [#3528](https://github.com/adobe/spectrum-css/pull/3528) [`bee70fb`](https://github.com/adobe/spectrum-css/commit/bee70fbab5f12b49ce2611366b614c75277e0aa9) Thanks [@castastrophe](https://github.com/castastrophe)!
 - Update fetchToken to use the exported JSON from @spectrum-css/tokens instead of @adobe/spectrum-tokens
 
-- [#3541](https://github.com/adobe/spectrum-css/pull/3541) [`1a3245c`](https://github.com/adobe/spectrum-css/commit/1a3245c3a660bc52ed260f18b6cceab5ee81541d) Thanks [@castastrophe](https://github.com/castastrophe)! 
+- [#3541](https://github.com/adobe/spectrum-css/pull/3541) [`1a3245c`](https://github.com/adobe/spectrum-css/commit/1a3245c3a660bc52ed260f18b6cceab5ee81541d) Thanks [@castastrophe](https://github.com/castastrophe)!
 - Dependency alignment across the project.
 
   Set component peerDependencies as optional to reduce console warnings on downstream projects.
@@ -33,12 +33,10 @@
 
 ### Major Changes
 
-- [#2786](https://github.com/adobe/spectrum-css/pull/2786) [`6c19fcf`](https://github.com/adobe/spectrum-css/commit/6c19fcf3f0eda76987f338981ae20f9999febce6) Thanks [@pfulton](https://github.com/pfulton)! 
+- [#2786](https://github.com/adobe/spectrum-css/pull/2786) [`6c19fcf`](https://github.com/adobe/spectrum-css/commit/6c19fcf3f0eda76987f338981ae20f9999febce6) Thanks [@pfulton](https://github.com/pfulton)!
 
 #### Breaking change
 
-  This update removes the previously deprecated component documentation for **cyclebutton**, **quickaction**, **searchwithin**, and **splitbutton**.
-
 This update removes the previously deprecated component documentation for **cyclebutton**, **quickaction**, **searchwithin**, and **splitbutton**.
 
 To support the Spectrum 2 (S2) Foundations release, Storybook has been updated to toggle token packages to connect the following labels with their appropriate data sources:
@@ -49,7 +47,9 @@ To support the Spectrum 2 (S2) Foundations release, Storybook has been updated t
 
 This release also includes:
 
-#### Patch Changes
+- New migration documentation for S1 -> S2 updates
+- Fix for the duplicate line numbers in the code preview plugin
+- Updated styles to integrate Spectrum styling into the Storybook UI
 
 #### Patch Changes
 
@@ -61,7 +61,7 @@ This release also includes:
 
 ### Patch Changes
 
-- [#3522](https://github.com/adobe/spectrum-css/pull/3522) [`7a47c22`](https://github.com/adobe/spectrum-css/commit/7a47c2266b6d0e8c99061fe85cba8d52684bae39) Thanks [@castastrophe](https://github.com/castastrophe)! 
+- [#3522](https://github.com/adobe/spectrum-css/pull/3522) [`7a47c22`](https://github.com/adobe/spectrum-css/commit/7a47c2266b6d0e8c99061fe85cba8d52684bae39) Thanks [@castastrophe](https://github.com/castastrophe)!
 - Minor storybook updates and fixes including some whitespace changes.
 
   A bug was fixed with the HTML code preview that was displaying duplicate line numbers.
@@ -86,7 +86,7 @@ This release also includes:
 
 ### Major Changes
 
-- [#3458](https://github.com/adobe/spectrum-css/pull/3458) [`e1b7102`](https://github.com/adobe/spectrum-css/commit/e1b71027f92ce18feb3a63c100d2b4871fc73b9f) Thanks [@castastrophe](https://github.com/castastrophe)! 
+- [#3458](https://github.com/adobe/spectrum-css/pull/3458) [`e1b7102`](https://github.com/adobe/spectrum-css/commit/e1b71027f92ce18feb3a63c100d2b4871fc73b9f) Thanks [@castastrophe](https://github.com/castastrophe)!
 - Update the Chromatic add-on to the currently maintained package:
 
   - from "@chromaui/addon-visual-tests": "^1.0.0"
@@ -100,14 +100,14 @@ This release also includes:
 
 ### Patch Changes
 
-- [#3440](https://github.com/adobe/spectrum-css/pull/3440) [`6808c85`](https://github.com/adobe/spectrum-css/commit/6808c85295d472286c0a52e28d2279b2b5a16f92) Thanks [@castastrophe](https://github.com/castastrophe)! 
+- [#3440](https://github.com/adobe/spectrum-css/pull/3440) [`6808c85`](https://github.com/adobe/spectrum-css/commit/6808c85295d472286c0a52e28d2279b2b5a16f92) Thanks [@castastrophe](https://github.com/castastrophe)!
 - Fix an issue where "show code" was blocking loading in Storybook docs pages [CSS-1070]
 
 ## 10.12.0
 
 ### Minor Changes
 
-- [#3477](https://github.com/adobe/spectrum-css/pull/3477) [`d52c701`](https://github.com/adobe/spectrum-css/commit/d52c70196bf2d17433c239313a82f00f75d77e79) Thanks [@castastrophe](https://github.com/castastrophe)! 
+- [#3477](https://github.com/adobe/spectrum-css/pull/3477) [`d52c701`](https://github.com/adobe/spectrum-css/commit/d52c70196bf2d17433c239313a82f00f75d77e79) Thanks [@castastrophe](https://github.com/castastrophe)!
 - Update Storybook to leverage the new CSS bundled assets.
 
 ### Patch Changes

components/textfield/dist/metadata.json

@@ -292,11 +292,11 @@
     "--spectrum-font-size-200",
     "--spectrum-font-size-300",
     "--spectrum-font-size-75",
-    "--spectrum-gray-200",
     "--spectrum-gray-25",
     "--spectrum-gray-300",
     "--spectrum-gray-500",
     "--spectrum-gray-600",
+    "--spectrum-gray-800",
     "--spectrum-gray-900",
     "--spectrum-help-text-to-component",
     "--spectrum-negative-border-color-default",

components/textfield/themes/spectrum-two.css

@@ -14,14 +14,14 @@
 @container style(--system: spectrum) {
 	.spectrum-Textfield {
 		--spectrum-textfield-background-color: var(--spectrum-gray-25);
-		--spectrum-textfield-background-color-disabled: var(--spectrum-gray-200);
+		--spectrum-textfield-background-color-disabled: var(--spectrum-gray-25);
 
 		--spectrum-textfield-border-color: var(--spectrum-gray-500);
 		--spectrum-textfield-border-color-hover: var(--spectrum-gray-600);
-		--spectrum-textfield-border-color-focus: var(--spectrum-gray-500);
+		--spectrum-textfield-border-color-focus: var(--spectrum-gray-800);
 		--spectrum-textfield-border-color-focus-hover: var(--spectrum-gray-900);
-		--spectrum-textfield-border-color-keyboard-focus: var(--spectrum-gray-900);
-		--spectrum-textfield-border-color-disabled: transparent;
+		--spectrum-textfield-border-color-keyboard-focus: var(--spectrum-gray-800);
+		--spectrum-textfield-border-color-disabled: var(--spectrum-gray-300);
 
 		--spectrum-textfield-border-width: var(--spectrum-border-width-100);
 

components/textfield/themes/spectrum.css

@@ -22,6 +22,8 @@
 
 		--spectrum-textfield-border-color-disabled: var(--spectrum-gray-200);
 
+		--spectrum-textfield-border-color-keyboard-focus: var(--spectrum-gray-900);
+
 		--spectrum-textfield-icon-spacing-block-invalid: var(--spectrum-field-top-to-alert-icon-medium);
 
 		&.spectrum-Textfield--sizeS {