From 3eac8d69e4fbde542f96e623f3f911ef007d2861 Mon Sep 17 00:00:00 2001
From: Andrey Yamanov <tenphi@gmail.com>
Date: Thu, 27 Nov 2025 15:55:08 +0100
Subject: [PATCH 1/2] fix(TextInputBase): focused state styles

---
 .changeset/mighty-dodos-peel.md                   | 5 +++++
 src/components/fields/TextInput/TextInputBase.tsx | 8 +++-----
 2 files changed, 8 insertions(+), 5 deletions(-)
 create mode 100644 .changeset/mighty-dodos-peel.md

diff --git a/.changeset/mighty-dodos-peel.md b/.changeset/mighty-dodos-peel.md
new file mode 100644
index 000000000..bdb5acc32
--- /dev/null
+++ b/.changeset/mighty-dodos-peel.md
@@ -0,0 +1,5 @@
+---
+"@cube-dev/ui-kit": patch
+---
+
+Fix the focused state styles of text inputs.
diff --git a/src/components/fields/TextInput/TextInputBase.tsx b/src/components/fields/TextInput/TextInputBase.tsx
index 4db5146cc..1b776f145 100644
--- a/src/components/fields/TextInput/TextInputBase.tsx
+++ b/src/components/fields/TextInput/TextInputBase.tsx
@@ -63,15 +63,13 @@ export const INPUT_WRAPPER_STYLES: Styles = {
   },
   border: {
     '': true,
-    focused: '#purple-text',
     valid: '#success-text.50',
     invalid: '#danger-text.50',
+    focused: '#purple-text',
+    'valid & focused': '#success-text',
+    'invalid & focused': '#danger-text',
     disabled: true,
   },
-  outline: {
-    '': '#purple-03.0',
-    'invalid & focused': '#danger.50',
-  },
   preset: 't3',
   radius: true,
   cursor: 'text',

From aea17fea20a67ab968f0bdf4bd9cd1fefde5b339 Mon Sep 17 00:00:00 2001
From: Andrey Yamanov <tenphi@gmail.com>
Date: Thu, 27 Nov 2025 16:07:29 +0100
Subject: [PATCH 2/2] fix(TextInputBase): focused state styles * 2

---
 .../fields/TextInput/TextInput.stories.tsx    | 32 ++++++++++++++++++-
 1 file changed, 31 insertions(+), 1 deletion(-)

diff --git a/src/components/fields/TextInput/TextInput.stories.tsx b/src/components/fields/TextInput/TextInput.stories.tsx
index b8d1e9e6d..5c94a78fd 100644
--- a/src/components/fields/TextInput/TextInput.stories.tsx
+++ b/src/components/fields/TextInput/TextInput.stories.tsx
@@ -145,8 +145,38 @@ WithIcon.args = { icon: <IconCoin /> };
 export const Password = Template.bind({});
 Password.args = { icon: <IconCoin />, type: 'password' };
 
+export const Valid = Template.bind({});
+Valid.args = { validationState: 'valid', defaultValue: 'Valid input' };
+
 export const Invalid = Template.bind({});
-Invalid.args = { validationState: 'invalid' };
+Invalid.args = { validationState: 'invalid', defaultValue: 'Invalid input' };
+
+export const ValidationStates: StoryFn<CubeTextInputProps> = (args) => (
+  <Space gap="2x" flow="column" placeItems="start">
+    <Title level={5}>Valid State</Title>
+    <TextInput {...args} validationState="valid" defaultValue="Valid input" />
+
+    <Title level={5}>Invalid State</Title>
+    <TextInput
+      {...args}
+      validationState="invalid"
+      defaultValue="Invalid input"
+    />
+  </Space>
+);
+
+ValidationStates.args = {
+  width: '300px',
+};
+
+ValidationStates.parameters = {
+  docs: {
+    description: {
+      story:
+        'Use `validationState` prop to indicate validation status. Set to `valid` for success styling or `invalid` for error styling.',
+    },
+  },
+};
 
 export const Disabled = Template.bind({});
 Disabled.args = { isDisabled: true };