From 8497d9ddc5299a67fb131f190760ebac8ddc16b3 Mon Sep 17 00:00:00 2001
From: eunnn <ehddms0517@naver.com>
Date: Wed, 21 Oct 2026 10:27:43 +0900
Subject: [PATCH 1/5] feat(useInputState): add previous value to transformValue

---
 .../src/hooks/useInputState/useInputState.spec.ts  | 13 +++++++++++++
 .../src/hooks/useInputState/useInputState.ts       | 14 +++++++++-----
 2 files changed, 22 insertions(+), 5 deletions(-)

diff --git a/packages/react-simplikit/src/hooks/useInputState/useInputState.spec.ts b/packages/react-simplikit/src/hooks/useInputState/useInputState.spec.ts
index fede1844..25a5d3a8 100644
--- a/packages/react-simplikit/src/hooks/useInputState/useInputState.spec.ts
+++ b/packages/react-simplikit/src/hooks/useInputState/useInputState.spec.ts
@@ -67,6 +67,19 @@ describe('useInputState', () => {
     expect(input).toHaveValue('MUST BE UPPERCASE');
   });
 
+  it('should provide the previous value to the transform function', () => {
+    const { getByRole } = render(
+      createElement(
+        createTestInput('value', (nextValue, previousValue) => (nextValue.length > 5 ? previousValue : nextValue))
+      )
+    );
+
+    const input = getByRole('textbox');
+    fireEvent.change(input, { target: { value: 'values' } });
+
+    expect(input).toHaveValue('value');
+  });
+
   it('should update value when change event occurs on a textarea', async () => {
     const { getByRole } = render(createElement(createTestTextarea()));
     const textarea = getByRole('textbox');
diff --git a/packages/react-simplikit/src/hooks/useInputState/useInputState.ts b/packages/react-simplikit/src/hooks/useInputState/useInputState.ts
index e694efc6..a70c0ef8 100644
--- a/packages/react-simplikit/src/hooks/useInputState/useInputState.ts
+++ b/packages/react-simplikit/src/hooks/useInputState/useInputState.ts
@@ -10,8 +10,9 @@ type InitialValue = string | (() => string);
  * The returned `onChange` handler works with both `<input>` and `<textarea>` elements.
  *
  * @param {string | (() => string)} [initialValue=""] - The initial value of the input. Defaults to an empty string (`""`).
- * @param {(value: string) => string} [transformValue=(v: string) => v] - A function to transform the input value.
- *   Defaults to an identity function that returns the input unchanged.
+ * @param {(nextValue: string, previousValue: string) => string} [transformValue=(nextValue: string) => nextValue]
+ * - A function to transform the input value. The previous state value is available as its second argument.
+ *   Defaults to an identity function that returns the next input unchanged.
  *
  * @returns {[value: string, onChange: ChangeEventHandler<HTMLInputElement | HTMLTextAreaElement>]} A tuple containing:
  * - value `string` - The current state value;
@@ -28,12 +29,15 @@ type InitialValue = string | (() => string);
  *   );
  * }
  */
-export function useInputState(initialValue: InitialValue = '', transformValue: (value: string) => string = echo) {
+export function useInputState(
+  initialValue: InitialValue = '',
+  transformValue: (nextValue: string, previousValue: string) => string = echo
+) {
   const [value, setValue] = useState(initialValue);
 
   const handleValueChange: ChangeEventHandler<InputLikeElement> = useCallback(
-    ({ target: { value } }: ChangeEvent<InputLikeElement>) => {
-      setValue(transformValue(value));
+    ({ target: { value: nextValue } }: ChangeEvent<InputLikeElement>) => {
+      setValue(previousValue => transformValue(nextValue, previousValue));
     },
     [transformValue]
   );

From b26fd6e327b04dba549d8c76939f8c7ed62751ca Mon Sep 17 00:00:00 2001
From: eunnn <ehddms0517@naver.com>
Date: Wed, 21 Oct 2026 10:31:43 +0900
Subject: [PATCH 2/5] docs(useInputState): update useInputState document

---
 .../skills/react-simplikit/references/useInputState.md |  8 +++++---
 .../src/hooks/useInputState/es/useInputState.md        |  8 +++++---
 .../src/hooks/useInputState/ja/useInputState.md        |  8 +++++---
 .../src/hooks/useInputState/ko/useInputState.md        | 10 ++++++----
 .../src/hooks/useInputState/useInputState.md           |  8 +++++---
 .../src/hooks/useInputState/zh-Hans/useInputState.md   |  8 +++++---
 6 files changed, 31 insertions(+), 19 deletions(-)

diff --git a/packages/plugin/skills/react-simplikit/references/useInputState.md b/packages/plugin/skills/react-simplikit/references/useInputState.md
index d2678762..541ee383 100644
--- a/packages/plugin/skills/react-simplikit/references/useInputState.md
+++ b/packages/plugin/skills/react-simplikit/references/useInputState.md
@@ -8,7 +8,9 @@ The returned `onChange` handler works with both `<input>` and `<textarea>` eleme
 ```ts
 function useInputState(
   initialValue: string | (() => string) = '',
-  transformValue: (value: string) => string = (v: string) => v
+  transformValue: (nextValue: string, previousValue: string) => string = (
+    nextValue: string
+  ) => nextValue
 ): [
   value: string,
   onChange: ChangeEventHandler<HTMLInputElement | HTMLTextAreaElement>,
@@ -25,8 +27,8 @@ function useInputState(
 
 <Interface
   name="transformValue"
-  type="(value: string) => string"
-  description="A function to transform the input value. Defaults to an identity function that returns the input unchanged."
+  type="(nextValue: string, previousValue: string) => string"
+  description="A function to transform the input value. The previous state value is available as its second argument. Defaults to an identity function that returns the next input unchanged."
 />
 
 ### Return Value
diff --git a/packages/react-simplikit/src/hooks/useInputState/es/useInputState.md b/packages/react-simplikit/src/hooks/useInputState/es/useInputState.md
index 2c8796dc..51c1b1f2 100644
--- a/packages/react-simplikit/src/hooks/useInputState/es/useInputState.md
+++ b/packages/react-simplikit/src/hooks/useInputState/es/useInputState.md
@@ -8,7 +8,9 @@ El controlador `onChange` que devuelve funciona tanto con elementos `<input>` co
 ```ts
 function useInputState(
   initialValue: string | (() => string) = '',
-  transformValue: (value: string) => string = (v: string) => v
+  transformValue: (nextValue: string, previousValue: string) => string = (
+    nextValue: string
+  ) => nextValue
 ): [
   value: string,
   onChange: ChangeEventHandler<HTMLInputElement | HTMLTextAreaElement>,
@@ -25,8 +27,8 @@ function useInputState(
 
 <Interface
   name="transformValue"
-  type="(value: string) => string"
-  description="Una función para transformar el valor del campo de entrada. La función predeterminada es una función identidad que devuelve el valor sin cambios."
+  type="(nextValue: string, previousValue: string) => string"
+  description="Una función para transformar el valor del campo de entrada. Recibe el valor anterior del estado como segundo argumento. La función predeterminada es una función identidad que devuelve el siguiente valor de entrada sin cambios."
 />
 
 ### Valor de retorno
diff --git a/packages/react-simplikit/src/hooks/useInputState/ja/useInputState.md b/packages/react-simplikit/src/hooks/useInputState/ja/useInputState.md
index c4493df3..1daa0fa4 100644
--- a/packages/react-simplikit/src/hooks/useInputState/ja/useInputState.md
+++ b/packages/react-simplikit/src/hooks/useInputState/ja/useInputState.md
@@ -8,7 +8,9 @@
 ```ts
 function useInputState(
   initialValue: string | (() => string) = '',
-  transformValue: (value: string) => string = (v: string) => v
+  transformValue: (nextValue: string, previousValue: string) => string = (
+    nextValue: string
+  ) => nextValue
 ): [
   value: string,
   onChange: ChangeEventHandler<HTMLInputElement | HTMLTextAreaElement>,
@@ -25,8 +27,8 @@ function useInputState(
 
 <Interface
   name="transformValue"
-  type="(value: string) => string"
-  description="入力値を変換する関数です。デフォルトは入力値をそのまま返す恒等関数です。"
+  type="(nextValue: string, previousValue: string) => string"
+  description="入力値を変換する関数です。前の状態値を第2引数として受け取ります。デフォルトは次の入力値をそのまま返す恒等関数です。"
 />
 
 ### 戻り値
diff --git a/packages/react-simplikit/src/hooks/useInputState/ko/useInputState.md b/packages/react-simplikit/src/hooks/useInputState/ko/useInputState.md
index 97bf5c3d..1fa6ee24 100644
--- a/packages/react-simplikit/src/hooks/useInputState/ko/useInputState.md
+++ b/packages/react-simplikit/src/hooks/useInputState/ko/useInputState.md
@@ -7,7 +7,9 @@
 ```ts
 function useInputState(
   initialValue: string | (() => string) = '',
-  transformValue: (value: string) => string = (v: string) => v
+  transformValue: (nextValue: string, previousValue: string) => string = (
+    nextValue: string
+  ) => nextValue
 ): [
   value: string,
   onChange: ChangeEventHandler<HTMLInputElement | HTMLTextAreaElement>,
@@ -24,8 +26,8 @@ function useInputState(
 
 <Interface
   name="transformValue"
-  type="(value: string) => string"
-  description="입력 값을 변환하는 함수예요. 기본값은 아무 변화 없이 입력을 반환하는 함수예요."
+  type="(nextValue: string, previousValue: string) => string"
+  description="입력 값을 변환하는 함수예요. 이전 상태 값이 두 번째 인자로 전달돼요. 기본값은 다음 입력 값을 그대로 반환하는 함수예요."
 />
 
 ### 반환 값
@@ -33,7 +35,7 @@ function useInputState(
 <Interface
   name=""
   type="[value: string, onChange: ChangeEventHandler<HTMLInputElement | HTMLTextAreaElement>]"
-  description="튜플을 포함해요:"
+  description="다음 항목을 포함한 튜플이에요:"
   :nested="[
     {
       name: 'value',
diff --git a/packages/react-simplikit/src/hooks/useInputState/useInputState.md b/packages/react-simplikit/src/hooks/useInputState/useInputState.md
index d2678762..541ee383 100644
--- a/packages/react-simplikit/src/hooks/useInputState/useInputState.md
+++ b/packages/react-simplikit/src/hooks/useInputState/useInputState.md
@@ -8,7 +8,9 @@ The returned `onChange` handler works with both `<input>` and `<textarea>` eleme
 ```ts
 function useInputState(
   initialValue: string | (() => string) = '',
-  transformValue: (value: string) => string = (v: string) => v
+  transformValue: (nextValue: string, previousValue: string) => string = (
+    nextValue: string
+  ) => nextValue
 ): [
   value: string,
   onChange: ChangeEventHandler<HTMLInputElement | HTMLTextAreaElement>,
@@ -25,8 +27,8 @@ function useInputState(
 
 <Interface
   name="transformValue"
-  type="(value: string) => string"
-  description="A function to transform the input value. Defaults to an identity function that returns the input unchanged."
+  type="(nextValue: string, previousValue: string) => string"
+  description="A function to transform the input value. The previous state value is available as its second argument. Defaults to an identity function that returns the next input unchanged."
 />
 
 ### Return Value
diff --git a/packages/react-simplikit/src/hooks/useInputState/zh-Hans/useInputState.md b/packages/react-simplikit/src/hooks/useInputState/zh-Hans/useInputState.md
index 9624c241..f08c8345 100644
--- a/packages/react-simplikit/src/hooks/useInputState/zh-Hans/useInputState.md
+++ b/packages/react-simplikit/src/hooks/useInputState/zh-Hans/useInputState.md
@@ -7,7 +7,9 @@
 ```ts
 function useInputState(
   initialValue: string | (() => string) = '',
-  transformValue: (value: string) => string = (v: string) => v
+  transformValue: (nextValue: string, previousValue: string) => string = (
+    nextValue: string
+  ) => nextValue
 ): [
   value: string,
   onChange: ChangeEventHandler<HTMLInputElement | HTMLTextAreaElement>,
@@ -24,8 +26,8 @@ function useInputState(
 
 <Interface
   name="transformValue"
-  type="(value: string) => string"
-  description="用于转换输入值的函数。默认值为原样返回输入的恒等函数。"
+  type="(nextValue: string, previousValue: string) => string"
+  description="用于转换输入值的函数。第二个参数是更新前的状态值。默认值为原样返回下一个输入值的恒等函数。"
 />
 
 ### 返回值

From 77a8fadc7bb17aaa7850d333c6666281137af20e Mon Sep 17 00:00:00 2001
From: eunnn <ehddms0517@naver.com>
Date: Wed, 21 Oct 2026 10:42:48 +0900
Subject: [PATCH 3/5] feat(useInputState): add changeset

---
 .changeset/cozy-lizards-scream.md | 5 +++++
 1 file changed, 5 insertions(+)
 create mode 100644 .changeset/cozy-lizards-scream.md

diff --git a/.changeset/cozy-lizards-scream.md b/.changeset/cozy-lizards-scream.md
new file mode 100644
index 00000000..4555902a
--- /dev/null
+++ b/.changeset/cozy-lizards-scream.md
@@ -0,0 +1,5 @@
+---
+'react-simplikit': patch
+---
+
+Pass the previous state value as the second argument to useInputState's transformValue callback.

From 724068cbbce1fb30bb692554e55d3fd20aafaf8c Mon Sep 17 00:00:00 2001
From: eunnn <ehddms0517@naver.com>
Date: Thu, 22 Oct 2026 13:42:51 +0900
Subject: [PATCH 4/5] refactor(useInputState): rename parameter in echo
 function for clarity

---
 .../react-simplikit/src/hooks/useInputState/useInputState.ts  | 4 ++--
 1 file changed, 2 insertions(+), 2 deletions(-)

diff --git a/packages/react-simplikit/src/hooks/useInputState/useInputState.ts b/packages/react-simplikit/src/hooks/useInputState/useInputState.ts
index a70c0ef8..2d2f7295 100644
--- a/packages/react-simplikit/src/hooks/useInputState/useInputState.ts
+++ b/packages/react-simplikit/src/hooks/useInputState/useInputState.ts
@@ -45,6 +45,6 @@ export function useInputState(
   return [value, handleValueChange] as const;
 }
 
-function echo(v: string) {
-  return v;
+function echo(nextValue: string) {
+  return nextValue;
 }

From 560e3ee8ff8e6e8518044121b6bbc10deb8a7718 Mon Sep 17 00:00:00 2001
From: eunnn <ehddms0517@naver.com>
Date: Thu, 22 Oct 2026 13:56:19 +0900
Subject: [PATCH 5/5] fix(useInputState): use closure instead of updater

---
 .changeset/cozy-lizards-scream.md             |  2 +-
 .../hooks/useInputState/useInputState.spec.ts | 57 ++++++++++++++++++-
 .../src/hooks/useInputState/useInputState.ts  |  4 +-
 3 files changed, 59 insertions(+), 4 deletions(-)

diff --git a/.changeset/cozy-lizards-scream.md b/.changeset/cozy-lizards-scream.md
index 4555902a..a56400c5 100644
--- a/.changeset/cozy-lizards-scream.md
+++ b/.changeset/cozy-lizards-scream.md
@@ -1,5 +1,5 @@
 ---
-'react-simplikit': patch
+'react-simplikit': minor
 ---
 
 Pass the previous state value as the second argument to useInputState's transformValue callback.
diff --git a/packages/react-simplikit/src/hooks/useInputState/useInputState.spec.ts b/packages/react-simplikit/src/hooks/useInputState/useInputState.spec.ts
index 25a5d3a8..48b9aff9 100644
--- a/packages/react-simplikit/src/hooks/useInputState/useInputState.spec.ts
+++ b/packages/react-simplikit/src/hooks/useInputState/useInputState.spec.ts
@@ -1,4 +1,4 @@
-import { createElement } from 'react';
+import { ChangeEvent, createElement, StrictMode, useState } from 'react';
 import { fireEvent, render } from '@testing-library/react';
 import { describe, expect, it, vi } from 'vitest';
 
@@ -80,6 +80,61 @@ describe('useInputState', () => {
     expect(input).toHaveValue('value');
   });
 
+  it('should call transformValue once per change in StrictMode', () => {
+    const transformValue = vi.fn((nextValue: string) => nextValue);
+    const { getByRole } = render(createElement(StrictMode, null, createElement(createTestInput('', transformValue))));
+
+    fireEvent.change(getByRole('textbox'), { target: { value: 'a' } });
+
+    expect(transformValue).toHaveBeenCalledTimes(1);
+  });
+
+  it('should let transformValue update another component', () => {
+    const consoleError = vi.spyOn(console, 'error').mockImplementation(() => {});
+
+    function Input({ onTooLong }: { onTooLong: (tooLong: boolean) => void }) {
+      const [, setTouched] = useState(false);
+      const [value, onChange] = useInputState('', (nextValue, previousValue) => {
+        onTooLong(nextValue.length > 3);
+        return nextValue.length > 3 ? previousValue : nextValue;
+      });
+
+      return createElement('input', {
+        value,
+        onChange: (event: ChangeEvent<HTMLInputElement>) => {
+          setTouched(true);
+          onChange(event);
+        },
+      });
+    }
+
+    function Form() {
+      const [tooLong, setTooLong] = useState(false);
+      return createElement('div', null, createElement(Input, { onTooLong: setTooLong }), tooLong ? 'too long' : '');
+    }
+
+    const { getByRole, getByText } = render(createElement(Form));
+    fireEvent.change(getByRole('textbox'), { target: { value: 'abcd' } });
+
+    expect(getByText('too long')).toBeInTheDocument();
+    expect(consoleError).not.toHaveBeenCalled();
+    consoleError.mockRestore();
+  });
+
+  it('should pass the latest state as previousValue', () => {
+    const { getByRole } = render(
+      createElement(
+        createTestInput('', (nextValue, previousValue) => (nextValue.length > 3 ? previousValue : nextValue))
+      )
+    );
+    const input = getByRole('textbox');
+
+    fireEvent.change(input, { target: { value: 'abc' } });
+    fireEvent.change(input, { target: { value: 'abcd' } });
+
+    expect(input).toHaveValue('abc');
+  });
+
   it('should update value when change event occurs on a textarea', async () => {
     const { getByRole } = render(createElement(createTestTextarea()));
     const textarea = getByRole('textbox');
diff --git a/packages/react-simplikit/src/hooks/useInputState/useInputState.ts b/packages/react-simplikit/src/hooks/useInputState/useInputState.ts
index 2d2f7295..23c02a1f 100644
--- a/packages/react-simplikit/src/hooks/useInputState/useInputState.ts
+++ b/packages/react-simplikit/src/hooks/useInputState/useInputState.ts
@@ -37,9 +37,9 @@ export function useInputState(
 
   const handleValueChange: ChangeEventHandler<InputLikeElement> = useCallback(
     ({ target: { value: nextValue } }: ChangeEvent<InputLikeElement>) => {
-      setValue(previousValue => transformValue(nextValue, previousValue));
+      setValue(transformValue(nextValue, value));
     },
-    [transformValue]
+    [transformValue, value]
   );
 
   return [value, handleValueChange] as const;