@ehfuse/forma 1.0.4 → 1.1.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/README.md +107 -59
- package/dist/esm/hooks/useFieldState.d.ts +79 -0
- package/dist/esm/hooks/useFieldState.d.ts.map +1 -0
- package/dist/esm/hooks/useFieldState.js +154 -0
- package/dist/esm/hooks/useFieldState.js.map +1 -0
- package/dist/esm/hooks/useForm.d.ts +1 -1
- package/dist/esm/hooks/useForm.d.ts.map +1 -1
- package/dist/esm/hooks/useForm.js +33 -71
- package/dist/esm/hooks/useForm.js.map +1 -1
- package/dist/esm/index.d.ts +3 -1
- package/dist/esm/index.d.ts.map +1 -1
- package/dist/esm/index.js +1 -0
- package/dist/esm/index.js.map +1 -1
- package/dist/hooks/useFieldState.d.ts +79 -0
- package/dist/hooks/useFieldState.d.ts.map +1 -0
- package/dist/hooks/useFieldState.js +157 -0
- package/dist/hooks/useFieldState.js.map +1 -0
- package/dist/hooks/useForm.d.ts +1 -1
- package/dist/hooks/useForm.d.ts.map +1 -1
- package/dist/hooks/useForm.js +32 -70
- package/dist/hooks/useForm.js.map +1 -1
- package/dist/index.d.ts +3 -1
- package/dist/index.d.ts.map +1 -1
- package/dist/index.js +3 -1
- package/dist/index.js.map +1 -1
- package/package.json +2 -2
|
@@ -27,25 +27,8 @@
|
|
|
27
27
|
* OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
|
|
28
28
|
* SOFTWARE.
|
|
29
29
|
*/
|
|
30
|
-
import {
|
|
31
|
-
import {
|
|
32
|
-
/**
|
|
33
|
-
* 개별 필드 구독 / Individual field subscription
|
|
34
|
-
* 특정 필드만 구독하여 해당 필드가 변경될 때만 리렌더링
|
|
35
|
-
* Subscribe to specific field only, re-render only when that field changes
|
|
36
|
-
*/
|
|
37
|
-
function useFieldValue(store, fieldName) {
|
|
38
|
-
const [value, setValue] = useState(() => store.getValue(fieldName));
|
|
39
|
-
useEffect(() => {
|
|
40
|
-
// 구독 설정 / Setup subscription
|
|
41
|
-
const unsubscribe = store.subscribe(fieldName, () => {
|
|
42
|
-
const newValue = store.getValue(fieldName);
|
|
43
|
-
setValue(newValue);
|
|
44
|
-
});
|
|
45
|
-
return unsubscribe;
|
|
46
|
-
}, [fieldName]); // store 의존성 제거로 불필요한 재구독 방지 / Remove store dependency to prevent unnecessary re-subscriptions
|
|
47
|
-
return value;
|
|
48
|
-
}
|
|
30
|
+
import { useFieldState } from "./useFieldState";
|
|
31
|
+
import { useState, useCallback, useMemo, } from "react";
|
|
49
32
|
/**
|
|
50
33
|
* Forma 핵심 폼 관리 훅 / Forma core form management hook
|
|
51
34
|
*
|
|
@@ -63,38 +46,17 @@ function useFieldValue(store, fieldName) {
|
|
|
63
46
|
* @returns 폼 관리 API 객체 / Form management API object
|
|
64
47
|
*/
|
|
65
48
|
export function useForm({ initialValues, onSubmit, onValidate, onComplete, _externalStore, }) {
|
|
66
|
-
//
|
|
67
|
-
|
|
68
|
-
|
|
69
|
-
if (_externalStore) {
|
|
70
|
-
storeRef.current = _externalStore;
|
|
71
|
-
}
|
|
72
|
-
else if (!storeRef.current) {
|
|
73
|
-
storeRef.current = new FieldStore(initialValues);
|
|
74
|
-
}
|
|
75
|
-
const store = storeRef.current;
|
|
49
|
+
// useFieldState를 기반으로 사용 / Use useFieldState as foundation
|
|
50
|
+
const fieldState = useFieldState(initialValues, { _externalStore });
|
|
51
|
+
// 폼 특정 상태 관리 / Form-specific state management
|
|
76
52
|
const [isSubmitting, setIsSubmitting] = useState(false);
|
|
77
53
|
const [isValidating, setIsValidating] = useState(false);
|
|
78
|
-
|
|
79
|
-
|
|
80
|
-
|
|
81
|
-
|
|
82
|
-
const modified = store.isModified();
|
|
83
|
-
setIsModified(modified);
|
|
84
|
-
};
|
|
85
|
-
checkModified();
|
|
86
|
-
const unsubscribe = store.subscribeGlobal(checkModified);
|
|
87
|
-
return unsubscribe;
|
|
88
|
-
}, [store]);
|
|
54
|
+
// 폼이 수정되었는지 확인 / Check if form is modified
|
|
55
|
+
const isModified = useMemo(() => {
|
|
56
|
+
return fieldState._store.isModified();
|
|
57
|
+
}, [fieldState.values]); // Use values as dependency for reactivity
|
|
89
58
|
// 호환성을 위한 values 객체 (비권장) / Values object for compatibility (not recommended)
|
|
90
|
-
const
|
|
91
|
-
useEffect(() => {
|
|
92
|
-
const unsubscribe = store.subscribeGlobal(() => {
|
|
93
|
-
setValuesSnapshot(store.getValues());
|
|
94
|
-
});
|
|
95
|
-
return unsubscribe;
|
|
96
|
-
}, [store]);
|
|
97
|
-
const values = valuesSnapshot;
|
|
59
|
+
const values = fieldState.values;
|
|
98
60
|
/**
|
|
99
61
|
* 통합 폼 변경 핸들러 / Unified form change handler
|
|
100
62
|
* MUI Select, TextField, DatePicker 등 모든 컴포넌트 지원
|
|
@@ -122,8 +84,8 @@ export function useForm({ initialValues, onSubmit, onValidate, onComplete, _exte
|
|
|
122
84
|
else if (value === null) {
|
|
123
85
|
newValue = undefined;
|
|
124
86
|
}
|
|
125
|
-
|
|
126
|
-
}, [
|
|
87
|
+
fieldState.setValue(name, newValue);
|
|
88
|
+
}, [fieldState.setValue]);
|
|
127
89
|
/**
|
|
128
90
|
* DatePicker 전용 변경 핸들러 / DatePicker-specific change handler
|
|
129
91
|
* 간편한 사용을 위한 커링 함수 / Curried function for convenient usage
|
|
@@ -138,9 +100,9 @@ export function useForm({ initialValues, onSubmit, onValidate, onComplete, _exte
|
|
|
138
100
|
else if (value === null) {
|
|
139
101
|
newValue = undefined;
|
|
140
102
|
}
|
|
141
|
-
|
|
103
|
+
fieldState.setValue(fieldName, newValue);
|
|
142
104
|
};
|
|
143
|
-
}, [
|
|
105
|
+
}, [fieldState.setValue]);
|
|
144
106
|
/**
|
|
145
107
|
* 개별 필드 값 설정 / Set individual field value
|
|
146
108
|
*/
|
|
@@ -153,40 +115,40 @@ export function useForm({ initialValues, onSubmit, onValidate, onComplete, _exte
|
|
|
153
115
|
else if (value === null) {
|
|
154
116
|
processedValue = undefined;
|
|
155
117
|
}
|
|
156
|
-
|
|
157
|
-
}, [
|
|
118
|
+
fieldState.setValue(name, processedValue);
|
|
119
|
+
}, [fieldState.setValue]);
|
|
158
120
|
/**
|
|
159
121
|
* 전체 폼 값 설정 / Set all form values
|
|
160
122
|
*/
|
|
161
123
|
const setFormValues = useCallback((newValues) => {
|
|
162
|
-
|
|
163
|
-
}, [
|
|
124
|
+
fieldState.setValues(newValues);
|
|
125
|
+
}, [fieldState.setValues]);
|
|
164
126
|
/**
|
|
165
127
|
* 초기값 재설정 / Reset initial values
|
|
166
128
|
*/
|
|
167
129
|
const setInitialFormValues = useCallback((newInitialValues) => {
|
|
168
|
-
|
|
169
|
-
}, [
|
|
130
|
+
fieldState._store.setInitialValues(newInitialValues);
|
|
131
|
+
}, [fieldState._store]);
|
|
170
132
|
/**
|
|
171
133
|
* 구독 없이 현재 값만 가져오기 / Get current value without subscription
|
|
172
134
|
*/
|
|
173
135
|
const getFormValue = useCallback((fieldName) => {
|
|
174
|
-
return
|
|
175
|
-
}, [
|
|
136
|
+
return fieldState._store.getValue(fieldName);
|
|
137
|
+
}, [fieldState._store]);
|
|
176
138
|
/**
|
|
177
139
|
* 모든 폼 값 가져오기 / Get all form values
|
|
178
140
|
*/
|
|
179
141
|
const getFormValues = useCallback(() => {
|
|
180
|
-
return
|
|
181
|
-
}, [
|
|
142
|
+
return fieldState.getValues();
|
|
143
|
+
}, [fieldState.getValues]);
|
|
182
144
|
/**
|
|
183
145
|
* 개별 필드 구독 Hook / Individual field subscription hook
|
|
184
146
|
* 해당 필드가 변경될 때만 컴포넌트가 리렌더링됩니다
|
|
185
147
|
* Component re-renders only when the specific field changes
|
|
186
148
|
*/
|
|
187
149
|
const useFormValue = useCallback((fieldName) => {
|
|
188
|
-
return
|
|
189
|
-
}, [
|
|
150
|
+
return fieldState.useValue(fieldName);
|
|
151
|
+
}, [fieldState.useValue]);
|
|
190
152
|
/**
|
|
191
153
|
* 폼 검증 / Form validation
|
|
192
154
|
*/
|
|
@@ -194,7 +156,7 @@ export function useForm({ initialValues, onSubmit, onValidate, onComplete, _exte
|
|
|
194
156
|
if (!onValidate)
|
|
195
157
|
return true;
|
|
196
158
|
setIsValidating(true);
|
|
197
|
-
const currentValues = valuesToValidate ||
|
|
159
|
+
const currentValues = valuesToValidate || fieldState.getValues();
|
|
198
160
|
try {
|
|
199
161
|
return await onValidate(currentValues);
|
|
200
162
|
}
|
|
@@ -205,22 +167,22 @@ export function useForm({ initialValues, onSubmit, onValidate, onComplete, _exte
|
|
|
205
167
|
finally {
|
|
206
168
|
setIsValidating(false);
|
|
207
169
|
}
|
|
208
|
-
}, [onValidate,
|
|
170
|
+
}, [onValidate, fieldState.getValues]);
|
|
209
171
|
/**
|
|
210
172
|
* 폼 초기화 / Reset form
|
|
211
173
|
*/
|
|
212
174
|
const resetForm = useCallback(() => {
|
|
213
|
-
|
|
175
|
+
fieldState.reset();
|
|
214
176
|
setIsSubmitting(false);
|
|
215
177
|
setIsValidating(false);
|
|
216
|
-
}, [
|
|
178
|
+
}, [fieldState.reset]);
|
|
217
179
|
/**
|
|
218
180
|
* 폼 제출 / Submit form
|
|
219
181
|
*/
|
|
220
182
|
const submit = useCallback(async (e) => {
|
|
221
183
|
if (e)
|
|
222
184
|
e.preventDefault();
|
|
223
|
-
const currentValues =
|
|
185
|
+
const currentValues = fieldState.getValues();
|
|
224
186
|
if (!(await validateForm(currentValues))) {
|
|
225
187
|
return false;
|
|
226
188
|
}
|
|
@@ -241,7 +203,7 @@ export function useForm({ initialValues, onSubmit, onValidate, onComplete, _exte
|
|
|
241
203
|
finally {
|
|
242
204
|
setIsSubmitting(false);
|
|
243
205
|
}
|
|
244
|
-
}, [onSubmit, onComplete, validateForm,
|
|
206
|
+
}, [onSubmit, onComplete, validateForm, fieldState.getValues]);
|
|
245
207
|
return useMemo(() => ({
|
|
246
208
|
// 상태 / State
|
|
247
209
|
isSubmitting,
|
|
@@ -265,7 +227,7 @@ export function useForm({ initialValues, onSubmit, onValidate, onComplete, _exte
|
|
|
265
227
|
// 호환성 / Compatibility
|
|
266
228
|
values, // 비권장: 전체 리렌더링 발생 / not recommended: causes full re-renders
|
|
267
229
|
// 고급 사용 / Advanced usage
|
|
268
|
-
_store:
|
|
230
|
+
_store: fieldState._store, // 직접 store 접근용 / direct store access
|
|
269
231
|
}), [
|
|
270
232
|
isSubmitting,
|
|
271
233
|
isValidating,
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"useForm.js","sourceRoot":"","sources":["../../../hooks/useForm.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;GA4BG;
|
|
1
|
+
{"version":3,"file":"useForm.js","sourceRoot":"","sources":["../../../hooks/useForm.ts"],"names":[],"mappings":"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"}
|
package/dist/esm/index.d.ts
CHANGED
|
@@ -29,10 +29,12 @@
|
|
|
29
29
|
export { useForm } from "./hooks/useForm";
|
|
30
30
|
export { useGlobalForm } from "./hooks/useGlobalForm";
|
|
31
31
|
export { useRegisterGlobalForm } from "./hooks/useRegisterGlobalForm";
|
|
32
|
+
export { useFieldState } from "./hooks/useFieldState";
|
|
32
33
|
export { GlobalFormContext, GlobalFormProvider, } from "./contexts/GlobalFormContext";
|
|
33
34
|
export { FieldStore } from "./core/FieldStore";
|
|
34
35
|
export { getNestedValue, setNestedValue } from "./utils/dotNotation";
|
|
35
|
-
export type { UseFormProps, UseFormReturn,
|
|
36
|
+
export type { UseFormProps, UseFormReturn, FormValidationResult, FormChangeEvent, } from "./types/form";
|
|
37
|
+
export type { UseFieldStateOptions, UseFieldStateReturn, } from "./hooks/useFieldState";
|
|
36
38
|
export type { UseGlobalFormProps, UseGlobalFormReturn, GlobalFormProviderProps, GlobalFormContextType, GlobalFormStoreMap, GlobalFormMetadata, GlobalFormEvent, GlobalFormEventListener, GlobalFormConfig, GlobalFormMiddleware, ExtendedGlobalFormProviderProps, } from "./types/globalForm";
|
|
37
39
|
/**
|
|
38
40
|
* Forma library version
|
package/dist/esm/index.d.ts.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../index.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;GA2BG;AAGH,OAAO,EAAE,OAAO,EAAE,MAAM,iBAAiB,CAAC;AAC1C,OAAO,EAAE,aAAa,EAAE,MAAM,uBAAuB,CAAC;AACtD,OAAO,EAAE,qBAAqB,EAAE,MAAM,+BAA+B,CAAC;
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../index.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;GA2BG;AAGH,OAAO,EAAE,OAAO,EAAE,MAAM,iBAAiB,CAAC;AAC1C,OAAO,EAAE,aAAa,EAAE,MAAM,uBAAuB,CAAC;AACtD,OAAO,EAAE,qBAAqB,EAAE,MAAM,+BAA+B,CAAC;AACtE,OAAO,EAAE,aAAa,EAAE,MAAM,uBAAuB,CAAC;AAGtD,OAAO,EACH,iBAAiB,EACjB,kBAAkB,GACrB,MAAM,8BAA8B,CAAC;AAGtC,OAAO,EAAE,UAAU,EAAE,MAAM,mBAAmB,CAAC;AAG/C,OAAO,EAAE,cAAc,EAAE,cAAc,EAAE,MAAM,qBAAqB,CAAC;AAIrE,YAAY,EACR,YAAY,EACZ,aAAa,EACb,oBAAoB,EACpB,eAAe,GAClB,MAAM,cAAc,CAAC;AAGtB,YAAY,EACR,oBAAoB,EACpB,mBAAmB,GACtB,MAAM,uBAAuB,CAAC;AAG/B,YAAY,EACR,kBAAkB,EAClB,mBAAmB,EACnB,uBAAuB,EACvB,qBAAqB,EACrB,kBAAkB,EAClB,kBAAkB,EAClB,eAAe,EACf,uBAAuB,EACvB,gBAAgB,EAChB,oBAAoB,EACpB,+BAA+B,GAClC,MAAM,oBAAoB,CAAC;AAE5B;;GAEG;AACH,eAAO,MAAM,aAAa,UAAU,CAAC;AAErC;;GAEG;AACH,eAAO,MAAM,cAAc;;;;;;;;CAejB,CAAC"}
|
package/dist/esm/index.js
CHANGED
|
@@ -30,6 +30,7 @@
|
|
|
30
30
|
export { useForm } from "./hooks/useForm";
|
|
31
31
|
export { useGlobalForm } from "./hooks/useGlobalForm";
|
|
32
32
|
export { useRegisterGlobalForm } from "./hooks/useRegisterGlobalForm";
|
|
33
|
+
export { useFieldState } from "./hooks/useFieldState";
|
|
33
34
|
// ===== Context & Providers =====
|
|
34
35
|
export { GlobalFormContext, GlobalFormProvider, } from "./contexts/GlobalFormContext";
|
|
35
36
|
// ===== Core Classes =====
|
package/dist/esm/index.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.js","sourceRoot":"","sources":["../../index.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;GA2BG;AAEH,yBAAyB;AACzB,OAAO,EAAE,OAAO,EAAE,MAAM,iBAAiB,CAAC;AAC1C,OAAO,EAAE,aAAa,EAAE,MAAM,uBAAuB,CAAC;AACtD,OAAO,EAAE,qBAAqB,EAAE,MAAM,+BAA+B,CAAC;
|
|
1
|
+
{"version":3,"file":"index.js","sourceRoot":"","sources":["../../index.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;GA2BG;AAEH,yBAAyB;AACzB,OAAO,EAAE,OAAO,EAAE,MAAM,iBAAiB,CAAC;AAC1C,OAAO,EAAE,aAAa,EAAE,MAAM,uBAAuB,CAAC;AACtD,OAAO,EAAE,qBAAqB,EAAE,MAAM,+BAA+B,CAAC;AACtE,OAAO,EAAE,aAAa,EAAE,MAAM,uBAAuB,CAAC;AAEtD,kCAAkC;AAClC,OAAO,EACH,iBAAiB,EACjB,kBAAkB,GACrB,MAAM,8BAA8B,CAAC;AAEtC,2BAA2B;AAC3B,OAAO,EAAE,UAAU,EAAE,MAAM,mBAAmB,CAAC;AAE/C,gCAAgC;AAChC,OAAO,EAAE,cAAc,EAAE,cAAc,EAAE,MAAM,qBAAqB,CAAC;AAgCrE;;GAEG;AACH,MAAM,CAAC,MAAM,aAAa,GAAG,OAAO,CAAC;AAErC;;GAEG;AACH,MAAM,CAAC,MAAM,cAAc,GAAG;IAC1B,IAAI,EAAE,OAAO;IACb,OAAO,EAAE,aAAa;IACtB,WAAW,EAAE,8CAA8C;IAC3D,MAAM,EAAE,+BAA+B;IACvC,KAAK,EAAE,kBAAkB;IACzB,OAAO,EAAE,KAAK;IACd,QAAQ,EAAE;QACN,4DAA4D;QAC5D,kDAAkD;QAClD,wCAAwC;QACxC,8BAA8B;QAC9B,6BAA6B;QAC7B,qCAAqC;KACxC;CACK,CAAC"}
|
|
@@ -0,0 +1,79 @@
|
|
|
1
|
+
/**
|
|
2
|
+
* useFieldState.ts
|
|
3
|
+
*
|
|
4
|
+
* Advanced state management hook with individual field subscriptions
|
|
5
|
+
* Optimized for arrays, objects, and complex nested data structures
|
|
6
|
+
*
|
|
7
|
+
* @author KIM YOUNG JIN (ehfuse@gmail.com)
|
|
8
|
+
* @license MIT License
|
|
9
|
+
*/
|
|
10
|
+
import { FieldStore } from "../core/FieldStore";
|
|
11
|
+
/**
|
|
12
|
+
* Options for configuring useFieldState hook
|
|
13
|
+
* useFieldState 훅 설정을 위한 옵션
|
|
14
|
+
*/
|
|
15
|
+
export interface UseFieldStateOptions<T extends Record<string, any>> {
|
|
16
|
+
/** Optional callback when state changes | 상태 변경 시 선택적 콜백 */
|
|
17
|
+
onChange?: (values: T) => void;
|
|
18
|
+
/** Enable deep equality checking for better performance | 성능 향상을 위한 깊은 동등성 검사 활성화 */
|
|
19
|
+
deepEquals?: boolean;
|
|
20
|
+
/** External FieldStore instance for shared state | 공유 상태를 위한 외부 FieldStore 인스턴스 */
|
|
21
|
+
_externalStore?: FieldStore<T>;
|
|
22
|
+
}
|
|
23
|
+
/**
|
|
24
|
+
* Return type of useFieldState hook
|
|
25
|
+
* useFieldState 훅의 반환 타입
|
|
26
|
+
*/
|
|
27
|
+
export interface UseFieldStateReturn<T extends Record<string, any>> {
|
|
28
|
+
/** Subscribe to a specific field value with dot notation | dot notation으로 특정 필드 값 구독 */
|
|
29
|
+
useValue: <K extends string>(path: K) => any;
|
|
30
|
+
/** Set a specific field value with dot notation | dot notation으로 특정 필드 값 설정 */
|
|
31
|
+
setValue: <K extends string>(path: K, value: any) => void;
|
|
32
|
+
/** Get all current values (non-reactive) | 모든 현재 값 가져오기 (반응형 아님) */
|
|
33
|
+
getValues: () => T;
|
|
34
|
+
/** Set all values at once | 모든 값을 한 번에 설정 */
|
|
35
|
+
setValues: (values: Partial<T>) => void;
|
|
36
|
+
/** Reset to initial values | 초기값으로 재설정 */
|
|
37
|
+
reset: () => void;
|
|
38
|
+
/** Handle standard input change events | 표준 입력 변경 이벤트 처리 */
|
|
39
|
+
handleChange: (event: React.ChangeEvent<HTMLInputElement | HTMLTextAreaElement | HTMLSelectElement>) => void;
|
|
40
|
+
/** Direct access to the internal store for advanced usage | 고급 사용을 위한 내부 스토어 직접 접근 */
|
|
41
|
+
_store: FieldStore<T>;
|
|
42
|
+
/** Current values (reactive) | 현재 값들 (반응형) */
|
|
43
|
+
values: T;
|
|
44
|
+
}
|
|
45
|
+
/**
|
|
46
|
+
* Advanced state management hook with individual field subscriptions
|
|
47
|
+
* 개별 필드 구독을 통한 고급 상태 관리 훅
|
|
48
|
+
*
|
|
49
|
+
* Optimized for managing complex arrays, objects, and nested data structures
|
|
50
|
+
* where you want to avoid unnecessary re-renders when only specific fields change.
|
|
51
|
+
*
|
|
52
|
+
* 복잡한 배열, 객체, 중첩된 데이터 구조를 관리하는 데 최적화되어 있으며,
|
|
53
|
+
* 특정 필드만 변경될 때 불필요한 재렌더링을 방지하고자 할 때 사용합니다.
|
|
54
|
+
*
|
|
55
|
+
* @example
|
|
56
|
+
* ```typescript
|
|
57
|
+
* // Managing an array of users
|
|
58
|
+
* const state = useFieldState({
|
|
59
|
+
* initialValues: {
|
|
60
|
+
* users: [
|
|
61
|
+
* { name: 'John', email: 'john@example.com', age: 30 },
|
|
62
|
+
* { name: 'Jane', email: 'jane@example.com', age: 25 }
|
|
63
|
+
* ],
|
|
64
|
+
* settings: { theme: 'dark', notifications: true }
|
|
65
|
+
* }
|
|
66
|
+
* });
|
|
67
|
+
*
|
|
68
|
+
* // Subscribe to individual fields - only these components re-render when changed
|
|
69
|
+
* const firstName = state.useValue('users.0.name'); // Only re-renders when John's name changes
|
|
70
|
+
* const userAge = state.useValue('users.1.age'); // Only re-renders when Jane's age changes
|
|
71
|
+
* const theme = state.useValue('settings.theme'); // Only re-renders when theme changes
|
|
72
|
+
*
|
|
73
|
+
* // Update specific fields
|
|
74
|
+
* state.setValue('users.0.name', 'Johnny');
|
|
75
|
+
* state.setValue('settings.theme', 'light');
|
|
76
|
+
* ```
|
|
77
|
+
*/
|
|
78
|
+
export declare function useFieldState<T extends Record<string, any>>(initialValues: T, options?: UseFieldStateOptions<T>): UseFieldStateReturn<T>;
|
|
79
|
+
//# sourceMappingURL=useFieldState.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"useFieldState.d.ts","sourceRoot":"","sources":["../../hooks/useFieldState.ts"],"names":[],"mappings":"AAAA;;;;;;;;GAQG;AAGH,OAAO,EAAE,UAAU,EAAE,MAAM,oBAAoB,CAAC;AAGhD;;;GAGG;AACH,MAAM,WAAW,oBAAoB,CAAC,CAAC,SAAS,MAAM,CAAC,MAAM,EAAE,GAAG,CAAC;IAC/D,4DAA4D;IAC5D,QAAQ,CAAC,EAAE,CAAC,MAAM,EAAE,CAAC,KAAK,IAAI,CAAC;IAE/B,qFAAqF;IACrF,UAAU,CAAC,EAAE,OAAO,CAAC;IAErB,mFAAmF;IACnF,cAAc,CAAC,EAAE,UAAU,CAAC,CAAC,CAAC,CAAC;CAClC;AAED;;;GAGG;AACH,MAAM,WAAW,mBAAmB,CAAC,CAAC,SAAS,MAAM,CAAC,MAAM,EAAE,GAAG,CAAC;IAC9D,wFAAwF;IACxF,QAAQ,EAAE,CAAC,CAAC,SAAS,MAAM,EAAE,IAAI,EAAE,CAAC,KAAK,GAAG,CAAC;IAE7C,+EAA+E;IAC/E,QAAQ,EAAE,CAAC,CAAC,SAAS,MAAM,EAAE,IAAI,EAAE,CAAC,EAAE,KAAK,EAAE,GAAG,KAAK,IAAI,CAAC;IAE1D,oEAAoE;IACpE,SAAS,EAAE,MAAM,CAAC,CAAC;IAEnB,6CAA6C;IAC7C,SAAS,EAAE,CAAC,MAAM,EAAE,OAAO,CAAC,CAAC,CAAC,KAAK,IAAI,CAAC;IAExC,0CAA0C;IAC1C,KAAK,EAAE,MAAM,IAAI,CAAC;IAElB,4DAA4D;IAC5D,YAAY,EAAE,CACV,KAAK,EAAE,KAAK,CAAC,WAAW,CACpB,gBAAgB,GAAG,mBAAmB,GAAG,iBAAiB,CAC7D,KACA,IAAI,CAAC;IAEV,sFAAsF;IACtF,MAAM,EAAE,UAAU,CAAC,CAAC,CAAC,CAAC;IAEtB,8CAA8C;IAC9C,MAAM,EAAE,CAAC,CAAC;CACb;AAsBD;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAgCG;AACH,wBAAgB,aAAa,CAAC,CAAC,SAAS,MAAM,CAAC,MAAM,EAAE,GAAG,CAAC,EACvD,aAAa,EAAE,CAAC,EAChB,OAAO,GAAE,oBAAoB,CAAC,CAAC,CAAM,GACtC,mBAAmB,CAAC,CAAC,CAAC,CA2HxB"}
|
|
@@ -0,0 +1,157 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
/**
|
|
3
|
+
* useFieldState.ts
|
|
4
|
+
*
|
|
5
|
+
* Advanced state management hook with individual field subscriptions
|
|
6
|
+
* Optimized for arrays, objects, and complex nested data structures
|
|
7
|
+
*
|
|
8
|
+
* @author KIM YOUNG JIN (ehfuse@gmail.com)
|
|
9
|
+
* @license MIT License
|
|
10
|
+
*/
|
|
11
|
+
Object.defineProperty(exports, "__esModule", { value: true });
|
|
12
|
+
exports.useFieldState = useFieldState;
|
|
13
|
+
const react_1 = require("react");
|
|
14
|
+
const FieldStore_1 = require("../core/FieldStore");
|
|
15
|
+
const dotNotation_1 = require("../utils/dotNotation");
|
|
16
|
+
/**
|
|
17
|
+
* Individual field subscription for useFieldState
|
|
18
|
+
* 개별 필드 구독을 위한 내부 함수
|
|
19
|
+
*/
|
|
20
|
+
function useFieldValue(store, fieldName) {
|
|
21
|
+
const [value, setValue] = (0, react_1.useState)(() => store.getValue(fieldName));
|
|
22
|
+
(0, react_1.useEffect)(() => {
|
|
23
|
+
// 구독 설정 / Setup subscription
|
|
24
|
+
const unsubscribe = store.subscribe(fieldName, () => {
|
|
25
|
+
const newValue = store.getValue(fieldName);
|
|
26
|
+
setValue(newValue);
|
|
27
|
+
});
|
|
28
|
+
return unsubscribe;
|
|
29
|
+
}, [fieldName]); // store 의존성 제거로 불필요한 재구독 방지 / Remove store dependency to prevent unnecessary re-subscriptions
|
|
30
|
+
return value;
|
|
31
|
+
}
|
|
32
|
+
/**
|
|
33
|
+
* Advanced state management hook with individual field subscriptions
|
|
34
|
+
* 개별 필드 구독을 통한 고급 상태 관리 훅
|
|
35
|
+
*
|
|
36
|
+
* Optimized for managing complex arrays, objects, and nested data structures
|
|
37
|
+
* where you want to avoid unnecessary re-renders when only specific fields change.
|
|
38
|
+
*
|
|
39
|
+
* 복잡한 배열, 객체, 중첩된 데이터 구조를 관리하는 데 최적화되어 있으며,
|
|
40
|
+
* 특정 필드만 변경될 때 불필요한 재렌더링을 방지하고자 할 때 사용합니다.
|
|
41
|
+
*
|
|
42
|
+
* @example
|
|
43
|
+
* ```typescript
|
|
44
|
+
* // Managing an array of users
|
|
45
|
+
* const state = useFieldState({
|
|
46
|
+
* initialValues: {
|
|
47
|
+
* users: [
|
|
48
|
+
* { name: 'John', email: 'john@example.com', age: 30 },
|
|
49
|
+
* { name: 'Jane', email: 'jane@example.com', age: 25 }
|
|
50
|
+
* ],
|
|
51
|
+
* settings: { theme: 'dark', notifications: true }
|
|
52
|
+
* }
|
|
53
|
+
* });
|
|
54
|
+
*
|
|
55
|
+
* // Subscribe to individual fields - only these components re-render when changed
|
|
56
|
+
* const firstName = state.useValue('users.0.name'); // Only re-renders when John's name changes
|
|
57
|
+
* const userAge = state.useValue('users.1.age'); // Only re-renders when Jane's age changes
|
|
58
|
+
* const theme = state.useValue('settings.theme'); // Only re-renders when theme changes
|
|
59
|
+
*
|
|
60
|
+
* // Update specific fields
|
|
61
|
+
* state.setValue('users.0.name', 'Johnny');
|
|
62
|
+
* state.setValue('settings.theme', 'light');
|
|
63
|
+
* ```
|
|
64
|
+
*/
|
|
65
|
+
function useFieldState(initialValues, options = {}) {
|
|
66
|
+
const { onChange, deepEquals = false, _externalStore } = options;
|
|
67
|
+
// Create or use external field store instance (persists across renders)
|
|
68
|
+
// 필드 스토어 인스턴스 생성 또는 외부 스토어 사용 (렌더링 간 유지)
|
|
69
|
+
const storeRef = (0, react_1.useRef)(null);
|
|
70
|
+
if (_externalStore) {
|
|
71
|
+
storeRef.current = _externalStore;
|
|
72
|
+
}
|
|
73
|
+
else if (!storeRef.current) {
|
|
74
|
+
storeRef.current = new FieldStore_1.FieldStore(initialValues);
|
|
75
|
+
// Set up global change listener if provided
|
|
76
|
+
// 글로벌 변경 리스너 설정 (제공된 경우)
|
|
77
|
+
if (onChange) {
|
|
78
|
+
storeRef.current.subscribeGlobal(() => {
|
|
79
|
+
onChange(storeRef.current.getValues());
|
|
80
|
+
});
|
|
81
|
+
}
|
|
82
|
+
}
|
|
83
|
+
const store = storeRef.current;
|
|
84
|
+
// Update initial values when they change (only for non-external stores)
|
|
85
|
+
// 초기값이 변경되면 업데이트 (외부 스토어가 아닌 경우에만)
|
|
86
|
+
(0, react_1.useEffect)(() => {
|
|
87
|
+
if (!_externalStore && store) {
|
|
88
|
+
store.setInitialValues(initialValues);
|
|
89
|
+
}
|
|
90
|
+
}, [initialValues, store, _externalStore]);
|
|
91
|
+
// Subscribe to a specific field value with dot notation
|
|
92
|
+
// dot notation으로 특정 필드 값 구독
|
|
93
|
+
const useValue = (0, react_1.useCallback)((path) => {
|
|
94
|
+
return useFieldValue(store, path);
|
|
95
|
+
}, [store]);
|
|
96
|
+
// Set a specific field value with dot notation
|
|
97
|
+
// dot notation으로 특정 필드 값 설정
|
|
98
|
+
const setValue = (0, react_1.useCallback)((path, value) => {
|
|
99
|
+
const currentValues = store.getValues();
|
|
100
|
+
const newValues = (0, dotNotation_1.setNestedValue)(currentValues, path, value);
|
|
101
|
+
store.setValues(newValues);
|
|
102
|
+
}, [store]);
|
|
103
|
+
// Get all current values (non-reactive)
|
|
104
|
+
// 모든 현재 값 가져오기 (반응형 아님)
|
|
105
|
+
const getValues = (0, react_1.useCallback)(() => {
|
|
106
|
+
return store.getValues();
|
|
107
|
+
}, [store]);
|
|
108
|
+
// Set all values at once
|
|
109
|
+
// 모든 값을 한 번에 설정
|
|
110
|
+
const setValues = (0, react_1.useCallback)((values) => {
|
|
111
|
+
const currentValues = store.getValues();
|
|
112
|
+
const newValues = { ...currentValues, ...values };
|
|
113
|
+
store.setValues(newValues);
|
|
114
|
+
}, [store]);
|
|
115
|
+
// Reset to initial values
|
|
116
|
+
// 초기값으로 재설정
|
|
117
|
+
const reset = (0, react_1.useCallback)(() => {
|
|
118
|
+
store.setValues(initialValues);
|
|
119
|
+
}, [store, initialValues]);
|
|
120
|
+
// Handle standard input change events
|
|
121
|
+
// 표준 입력 변경 이벤트 처리
|
|
122
|
+
const handleChange = (0, react_1.useCallback)((event) => {
|
|
123
|
+
const { name, value, type } = event.target;
|
|
124
|
+
if (!name) {
|
|
125
|
+
console.warn('useFieldState.handleChange: input element must have a "name" attribute');
|
|
126
|
+
return;
|
|
127
|
+
}
|
|
128
|
+
let processedValue = value;
|
|
129
|
+
// Handle different input types
|
|
130
|
+
// 다양한 입력 타입 처리
|
|
131
|
+
if (type === "checkbox") {
|
|
132
|
+
processedValue = event.target.checked;
|
|
133
|
+
}
|
|
134
|
+
else if (type === "number") {
|
|
135
|
+
processedValue = value === "" ? "" : Number(value);
|
|
136
|
+
}
|
|
137
|
+
setValue(name, processedValue);
|
|
138
|
+
}, [setValue]);
|
|
139
|
+
// Get reactive values using the store's reactive mechanism
|
|
140
|
+
// 스토어의 반응형 메커니즘을 사용하여 반응형 값 가져오기
|
|
141
|
+
const values = (0, react_1.useMemo)(() => {
|
|
142
|
+
// This creates a reactive subscription to all values
|
|
143
|
+
// 모든 값에 대한 반응형 구독 생성
|
|
144
|
+
return store.getValues();
|
|
145
|
+
}, [store]);
|
|
146
|
+
return {
|
|
147
|
+
useValue,
|
|
148
|
+
setValue,
|
|
149
|
+
getValues,
|
|
150
|
+
setValues,
|
|
151
|
+
reset,
|
|
152
|
+
handleChange,
|
|
153
|
+
_store: store,
|
|
154
|
+
values,
|
|
155
|
+
};
|
|
156
|
+
}
|
|
157
|
+
//# sourceMappingURL=useFieldState.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"useFieldState.js","sourceRoot":"","sources":["../../hooks/useFieldState.ts"],"names":[],"mappings":";AAAA;;;;;;;;GAQG;;AA4GH,sCA8HC;AAxOD,iCAA0E;AAC1E,mDAAgD;AAChD,sDAAsE;AAmDtE;;;GAGG;AACH,SAAS,aAAa,CAAI,KAAsB,EAAE,SAAiB;IAC/D,MAAM,CAAC,KAAK,EAAE,QAAQ,CAAC,GAAG,IAAA,gBAAQ,EAAC,GAAG,EAAE,CAAC,KAAK,CAAC,QAAQ,CAAC,SAAS,CAAC,CAAC,CAAC;IAEpE,IAAA,iBAAS,EAAC,GAAG,EAAE;QACX,6BAA6B;QAC7B,MAAM,WAAW,GAAG,KAAK,CAAC,SAAS,CAAC,SAAS,EAAE,GAAG,EAAE;YAChD,MAAM,QAAQ,GAAG,KAAK,CAAC,QAAQ,CAAC,SAAS,CAAC,CAAC;YAC3C,QAAQ,CAAC,QAAQ,CAAC,CAAC;QACvB,CAAC,CAAC,CAAC;QAEH,OAAO,WAAW,CAAC;IACvB,CAAC,EAAE,CAAC,SAAS,CAAC,CAAC,CAAC,CAAC,8FAA8F;IAE/G,OAAO,KAAK,CAAC;AACjB,CAAC;AAED;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAgCG;AACH,SAAgB,aAAa,CACzB,aAAgB,EAChB,UAAmC,EAAE;IAErC,MAAM,EAAE,QAAQ,EAAE,UAAU,GAAG,KAAK,EAAE,cAAc,EAAE,GAAG,OAAO,CAAC;IAEjE,wEAAwE;IACxE,yCAAyC;IACzC,MAAM,QAAQ,GAAG,IAAA,cAAM,EAAuB,IAAI,CAAC,CAAC;IACpD,IAAI,cAAc,EAAE,CAAC;QACjB,QAAQ,CAAC,OAAO,GAAG,cAAc,CAAC;IACtC,CAAC;SAAM,IAAI,CAAC,QAAQ,CAAC,OAAO,EAAE,CAAC;QAC3B,QAAQ,CAAC,OAAO,GAAG,IAAI,uBAAU,CAAI,aAAa,CAAC,CAAC;QAEpD,4CAA4C;QAC5C,yBAAyB;QACzB,IAAI,QAAQ,EAAE,CAAC;YACX,QAAQ,CAAC,OAAO,CAAC,eAAe,CAAC,GAAG,EAAE;gBAClC,QAAQ,CAAC,QAAQ,CAAC,OAAQ,CAAC,SAAS,EAAE,CAAC,CAAC;YAC5C,CAAC,CAAC,CAAC;QACP,CAAC;IACL,CAAC;IAED,MAAM,KAAK,GAAG,QAAQ,CAAC,OAAO,CAAC;IAE/B,wEAAwE;IACxE,mCAAmC;IACnC,IAAA,iBAAS,EAAC,GAAG,EAAE;QACX,IAAI,CAAC,cAAc,IAAI,KAAK,EAAE,CAAC;YAC3B,KAAK,CAAC,gBAAgB,CAAC,aAAa,CAAC,CAAC;QAC1C,CAAC;IACL,CAAC,EAAE,CAAC,aAAa,EAAE,KAAK,EAAE,cAAc,CAAC,CAAC,CAAC;IAE3C,wDAAwD;IACxD,4BAA4B;IAC5B,MAAM,QAAQ,GAAG,IAAA,mBAAW,EACxB,CAAmB,IAAO,EAAE,EAAE;QAC1B,OAAO,aAAa,CAAC,KAAK,EAAE,IAAI,CAAC,CAAC;IACtC,CAAC,EACD,CAAC,KAAK,CAAC,CACV,CAAC;IAEF,+CAA+C;IAC/C,4BAA4B;IAC5B,MAAM,QAAQ,GAAG,IAAA,mBAAW,EACxB,CAAmB,IAAO,EAAE,KAAU,EAAE,EAAE;QACtC,MAAM,aAAa,GAAG,KAAK,CAAC,SAAS,EAAE,CAAC;QACxC,MAAM,SAAS,GAAG,IAAA,4BAAc,EAAC,aAAa,EAAE,IAAI,EAAE,KAAK,CAAC,CAAC;QAC7D,KAAK,CAAC,SAAS,CAAC,SAAS,CAAC,CAAC;IAC/B,CAAC,EACD,CAAC,KAAK,CAAC,CACV,CAAC;IAEF,wCAAwC;IACxC,wBAAwB;IACxB,MAAM,SAAS,GAAG,IAAA,mBAAW,EAAC,GAAG,EAAE;QAC/B,OAAO,KAAK,CAAC,SAAS,EAAE,CAAC;IAC7B,CAAC,EAAE,CAAC,KAAK,CAAC,CAAC,CAAC;IAEZ,yBAAyB;IACzB,gBAAgB;IAChB,MAAM,SAAS,GAAG,IAAA,mBAAW,EACzB,CAAC,MAAkB,EAAE,EAAE;QACnB,MAAM,aAAa,GAAG,KAAK,CAAC,SAAS,EAAE,CAAC;QACxC,MAAM,SAAS,GAAG,EAAE,GAAG,aAAa,EAAE,GAAG,MAAM,EAAE,CAAC;QAClD,KAAK,CAAC,SAAS,CAAC,SAAc,CAAC,CAAC;IACpC,CAAC,EACD,CAAC,KAAK,CAAC,CACV,CAAC;IAEF,0BAA0B;IAC1B,YAAY;IACZ,MAAM,KAAK,GAAG,IAAA,mBAAW,EAAC,GAAG,EAAE;QAC3B,KAAK,CAAC,SAAS,CAAC,aAAa,CAAC,CAAC;IACnC,CAAC,EAAE,CAAC,KAAK,EAAE,aAAa,CAAC,CAAC,CAAC;IAE3B,sCAAsC;IACtC,kBAAkB;IAClB,MAAM,YAAY,GAAG,IAAA,mBAAW,EAC5B,CACI,KAEC,EACH,EAAE;QACA,MAAM,EAAE,IAAI,EAAE,KAAK,EAAE,IAAI,EAAE,GAAG,KAAK,CAAC,MAAM,CAAC;QAE3C,IAAI,CAAC,IAAI,EAAE,CAAC;YACR,OAAO,CAAC,IAAI,CACR,wEAAwE,CAC3E,CAAC;YACF,OAAO;QACX,CAAC;QAED,IAAI,cAAc,GAAQ,KAAK,CAAC;QAEhC,+BAA+B;QAC/B,eAAe;QACf,IAAI,IAAI,KAAK,UAAU,EAAE,CAAC;YACtB,cAAc,GAAI,KAAK,CAAC,MAA2B,CAAC,OAAO,CAAC;QAChE,CAAC;aAAM,IAAI,IAAI,KAAK,QAAQ,EAAE,CAAC;YAC3B,cAAc,GAAG,KAAK,KAAK,EAAE,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,MAAM,CAAC,KAAK,CAAC,CAAC;QACvD,CAAC;QAED,QAAQ,CAAC,IAAI,EAAE,cAAc,CAAC,CAAC;IACnC,CAAC,EACD,CAAC,QAAQ,CAAC,CACb,CAAC;IAEF,2DAA2D;IAC3D,iCAAiC;IACjC,MAAM,MAAM,GAAG,IAAA,eAAO,EAAC,GAAG,EAAE;QACxB,qDAAqD;QACrD,qBAAqB;QACrB,OAAO,KAAK,CAAC,SAAS,EAAE,CAAC;IAC7B,CAAC,EAAE,CAAC,KAAK,CAAC,CAAC,CAAC;IAEZ,OAAO;QACH,QAAQ;QACR,QAAQ;QACR,SAAS;QACT,SAAS;QACT,KAAK;QACL,YAAY;QACZ,MAAM,EAAE,KAAK;QACb,MAAM;KACT,CAAC;AACN,CAAC"}
|
package/dist/hooks/useForm.d.ts
CHANGED
|
@@ -50,7 +50,7 @@ export declare function useForm<T extends Record<string, any>>({ initialValues,
|
|
|
50
50
|
isSubmitting: boolean;
|
|
51
51
|
isValidating: boolean;
|
|
52
52
|
isModified: boolean;
|
|
53
|
-
useFormValue: (fieldName: string) =>
|
|
53
|
+
useFormValue: (fieldName: string) => any;
|
|
54
54
|
getFormValue: (fieldName: string) => any;
|
|
55
55
|
getFormValues: () => T;
|
|
56
56
|
setFormValue: (name: string, value: any) => void;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"useForm.d.ts","sourceRoot":"","sources":["../../hooks/useForm.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;GA4BG;AAEH,OAAO,EAAE,UAAU,EAAE,MAAM,oBAAoB,CAAC;AAChD,OAAO,EACH,eAAe,EACf,uBAAuB,EACvB,YAAY,EACf,MAAM,eAAe,CAAC;
|
|
1
|
+
{"version":3,"file":"useForm.d.ts","sourceRoot":"","sources":["../../hooks/useForm.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;GA4BG;AAEH,OAAO,EAAE,UAAU,EAAE,MAAM,oBAAoB,CAAC;AAChD,OAAO,EACH,eAAe,EACf,uBAAuB,EACvB,YAAY,EACf,MAAM,eAAe,CAAC;AAGvB,OAAO,KAMN,MAAM,OAAO,CAAC;AAKf;;;;;;;;;;;;;;;GAeG;AACH,wBAAgB,OAAO,CAAC,CAAC,SAAS,MAAM,CAAC,MAAM,EAAE,GAAG,CAAC,EAAE,EACnD,aAAa,EACb,QAAQ,EACR,UAAU,EACV,UAAU,EACV,cAAc,GACjB,EAAE,YAAY,CAAC,CAAC,CAAC;;;;8BAuIE,MAAM;8BAnBN,MAAM,KAAG,GAAG;yBASU,CAAC;yBAhD5B,MAAM,SAAS,GAAG;+BAmBb,OAAO,CAAC,CAAC,CAAC;6CAUH,CAAC;0BApFhB,eAAe;;iBAyJR,KAAK,CAAC,SAAS,KAAG,OAAO,CAAC,OAAO,CAAC;;sCA9BnB,CAAC;;;EA8GlC"}
|