@ehfuse/forma 2.0.10 → 2.1.0

package/README.md

@@ -11,61 +11,192 @@ Forma is a high-performance library that makes form and state management in Reac
 
 Forma는 React 애플리케이션에서 폼과 상태를 **간편하면서도 강력하게** 관리할 수 있는 고성능 라이브러리입니다. **Zero-Config로 바로 시작**할 수 있으며, 개별 필드 구독을 통한 **선택적 리렌더링**으로 최적의 성능을 제공합니다. 복잡한 설정 없이도 **글로벌 폼 상태 공유**, **Dot Notation 중첩 객체 접근**, **MUI 완전 호환** 등 프로덕션 레벨의 고급 기능들을 손쉽게 사용할 수 있습니다.
 
-## Key Features
-
--   🎯 **Complete Zero-Config**: Start immediately without any configuration
--   ✅ **Individual Field Subscription**: Optimized performance through selective re-rendering per field
--   🌟 **Global State Subscription**: Subscribe to entire state with `useValue("*")` pattern for optimal performance
--   ✅ **General State Management**: Efficient management of non-form states with `useFormaState`
--   🎭 **Modal Stack Management**: Mobile-friendly modal handling with back button support via `useModal`
--   📱 **Responsive Breakpoint Management**: Screen size detection and adaptive UI with `useBreakpoint`
--   ✅ **Dot Notation Optimization**: Access nested objects like `user.profile.name`
--   ✅ **Full MUI Compatibility**: Perfect integration with Material-UI components
--   ✅ **Global Form State**: Share form state across multiple components
--   ✅ **Form Registration System**: Register existing forms as global
--   ✅ **Full TypeScript Support**: Strong type safety
--   ✅ **React 19 Optimized**: Utilizing latest React features
-
-## 주요 특징
-
--   🎯 **완전한 Zero-Config**: 설정 없이 바로 사용 가능한 개발 경험
--   ✅ **개별 필드 구독**: 필드별 선택적 리렌더링으로 최적화된 성능
--   🌟 **전체 상태 구독**: `useValue("*")` 패턴으로 전체 상태를 한 번에 구독하여 최적 성능 제공
--   ✅ **범용 상태 관리**: `useFormaState`로 폼 외 일반 상태도 효율적 관리
--   🎭 **모달 스택 관리**: `useModal`로 뒤로가기 지원하는 모바일 친화적 모달 처리
--   📱 **반응형 브레이크포인트 관리**: `useBreakpoint`로 화면 크기 감지 및 적응형 UI 구현
--   ✅ **Dot Notation 최적화**: `user.profile.name` 형태의 중첩 객체 접근
--   ✅ **MUI 완전 호환**: Material-UI 컴포넌트와 완벽한 통합
--   ✅ **글로벌 폼 상태**: 여러 컴포넌트 간 폼 상태 공유
--   ✅ **폼 등록 시스템**: 기존 폼을 글로벌로 등록 가능
--   ✅ **TypeScript 완전 지원**: 강력한 타입 안전성
--   ✅ **React 19 최적화**: 최신 React 기능 활용
+## Why Forma? | 왜 Forma인가?
+
+Forma는 단순한 폼 라이브러리가 아닙니다. **React 상태 관리의 패러다임을 바꾸는** 혁신적인 솔루션입니다.
+
+### 🚀 The Ultimate State Management Solution | 최강의 상태 관리 솔루션
+
+#### 1. **Watch + Actions = No More useEffect & useState & Context**
+
+**useEffect, useState, Context 지옥에서 탈출하세요**
+
+```tsx
+// ❌ Traditional: useEffect + useState + Context + Props Drilling
+const AuthContext = createContext(null);
+
+function App() {
+    const [logined, setLogined] = useState(false);
+    const [syncInterval, setSyncInterval] = useState(null);
+
+    useEffect(() => {
+        if (logined) {
+            const interval = setInterval(() => syncData(), 5000);
+            setSyncInterval(interval);
+        } else {
+            if (syncInterval) clearInterval(syncInterval);
+            setSyncInterval(null);
+        }
+    }, [logined]);
+
+    // Props drilling or Context Provider needed
+    return (
+        <AuthContext.Provider value={{ logined, setLogined }}>
+            <Header />
+            <Main />
+            <Footer />
+        </AuthContext.Provider>
+    );
+}
+
+// ✅ Forma: Clean and declarative
+const state = useGlobalFormaState({
+    stateId: "auth",
+    initialValues: {
+        logined: false,
+        user: { name: "", email: "" },
+        syncInterval: null,
+    },
+    actions: {
+        startSync: (ctx) => {
+            const interval = setInterval(() => syncData(), 5000);
+            ctx.setValue("syncInterval", interval);
+        },
+        stopSync: (ctx) => {
+            const interval = ctx.getValue("syncInterval");
+            if (interval) clearInterval(interval);
+            ctx.setValue("syncInterval", null);
+        },
+    },
+    watch: {
+        logined: (ctx, value) => {
+            value ? ctx.actions.startSync(ctx) : ctx.actions.stopSync(ctx);
+        },
+        "user.email": (ctx, value) => {
+            console.log("Email changed:", value);
+        },
+    },
+});
+```
+
+**Benefits | 이점:**
+
+-   🧹 **No useEffect clutter** | useEffect 없이 깔끔한 코드
+-   � **No Context needed** | Context API 불필요
+-   🎯 **No Props Drilling** | Props 전달 지옥 탈출
+-   �📦 **Modular logic** | 로직을 별도 파일로 분리 가능
+-   🧪 **Easy testing** | actions/watch 단독 테스트 용이
+-   🎯 **Better code cohesion** | 높은 코드 응집도
+
+#### 2. **Surgical Re-rendering**
+
+**수술적 정밀도의 리렌더링**
+
+```tsx
+// ❌ Redux/Context: Entire component re-renders
+const { user, todos, settings } = useStore(); // or useContext(AppContext)
+// All fields change = entire component re-renders
+
+// ✅ Forma: Only what you need
+const userName = state.useValue("user.name"); // Only this field
+const todoCount = state.useValue("todos.length"); // Only array length
+const theme = state.useValue("settings.theme"); // Only theme
+// Each component subscribes to ONLY what it needs
+```
+
+**Performance | 성능:**
+
+-   ⚡ **10-100x faster** than Redux for large forms | 대규모 폼에서 Redux 대비 10-100배 빠름
+-   🎯 **Field-level optimization** | 필드 단위 최적화
+-   📊 **No selectors needed** | 셀렉터 불필요
+-   🔥 **Zero wasted renders** | 불필요한 렌더링 제로
+
+#### 3. **Form + State + Global Access in One**
+
+**폼, 상태, 글로벌 접근을 하나로**
+
+```tsx
+// ❌ Traditional: Multiple libraries + Context boilerplate
+import { useForm } from "react-hook-form";
+import { create } from "zustand";
+import { createContext, useContext } from "react";
+
+// Context setup, Provider wrapping, Props drilling...
+const FormContext = createContext(null);
+
+function App() {
+    const form = useForm();
+    return (
+        <FormContext.Provider value={form}>
+            <Header />
+            <MainContent />
+        </FormContext.Provider>
+    );
+}
+
+// ✅ Forma: One library, zero boilerplate
+import { useGlobalForm, useGlobalFormaState } from "@ehfuse/forma";
+
+function Header() {
+    // Access anywhere, no Provider needed!
+    const state = useGlobalFormaState<AuthState>({ stateId: "auth" });
+    const userName = state.useValue("user.name");
+}
+
+function MainContent() {
+    // Same state, no props drilling
+    const state = useGlobalFormaState<AuthState>({ stateId: "auth" });
+}
+```
+
+**All-in-One | 올인원:**
+
+-   📝 **Form management** | 폼 관리
+-   🌐 **Global state (no Context!)** | 전역 상태 (Context 불필요!)
+-   🚫 **No Props Drilling** | Props 전달 불필요
+-   👀 **Reactive watch** | 반응형 감시
+-   🎬 **Actions system** | 액션 시스템
+-   🎭 **Modal management** | 모달 관리
+-   📱 **Breakpoint detection** | 반응형 감지
+
+## Key Features | 주요 특징
+
+-   🎯 **Zero-Config**: Start immediately | 설정 없이 즉시 시작
+-   👀 **Watch System**: Replace useEffect with declarative watchers | useEffect를 선언적 watcher로 대체
+-   � **Actions Pattern**: Modular business logic | 모듈화된 비즈니스 로직
+-   ✅ **Individual Field Subscription**: Surgical re-rendering | 수술적 리렌더링
+-   🌟 **Dot Notation**: Deep nested access `user.profile.name` | 깊은 중첩 접근
+-   🌐 **Global State Sharing**: Share across components | 컴포넌트 간 공유
+-   🎭 **Modal Stack**: Mobile-friendly with back button | 뒤로가기 지원 모달
+-   📱 **Breakpoint Management**: Responsive UI made easy | 반응형 UI 간편화
+-   ✅ **Full MUI Compatibility**: Perfect Material-UI integration | MUI 완벽 통합
+-   ✅ **TypeScript Native**: Full type safety | 완전한 타입 안전성
 
 ## Documentation | 문서
 
 ### English
 
--   **[Getting Started Guide](./docs/getting-started-en.md)** - Step-by-step tutorial and examples
--   **[API Reference](./docs/API-en.md)** - Complete API documentation with examples
--   **[Examples Collection](./docs/examples-en.md)** - Practical usage examples and patterns
--   **[Performance Guide](./docs/performance-guide-en.md)** - Performance optimization techniques
--   **[Performance Warnings](./docs/performance-warnings-en.md)** - Anti-patterns and common pitfalls
--   **[Migration Guide](./docs/migration-en.md)** - Migrate from other form libraries
--   **[useGlobalForm Guide](./docs/useGlobalForm-guide-en.md)** - Global form state management
--   **[Global Hooks Comparison](./docs/global-hooks-comparison-en.md)** - useGlobalForm vs useGlobalFormaState
--   **[Library Comparison](./docs/library-comparison-en.md)** - Forma vs other libraries
+-   **[Getting Started Guide](./docs/en/getting-started.md)** - Step-by-step tutorial and examples
+-   **[API Reference](./docs/en/API.md)** - Complete API documentation with examples
+-   **[Examples Collection](./docs/en/examples.md)** - Practical usage examples and patterns
+-   **[Performance Guide](./docs/en/performance-guide.md)** - Performance optimization techniques
+-   **[Performance Warnings](./docs/en/performance-warnings.md)** - Anti-patterns and common pitfalls
+-   **[Migration Guide](./docs/en/migration.md)** - Migrate from other form libraries
+-   **[useGlobalForm Guide](./docs/en/useGlobalForm-guide.md)** - Global form state management
+-   **[Global Hooks Comparison](./docs/en/global-hooks-comparison.md)** - useGlobalForm vs useGlobalFormaState
+-   **[Library Comparison](./docs/en/library-comparison.md)** - Forma vs other libraries
 
 ### 한국어 (Korean)
 
--   **[시작 가이드](./docs/getting-started-ko.md)** - 단계별 튜토리얼과 예제
--   **[API 레퍼런스](./docs/API-ko.md)** - 완전한 API 문서와 예제
--   **[예제 모음](./docs/examples-ko.md)** - 실용적인 사용 예제와 패턴
--   **[성능 최적화 가이드](./docs/performance-guide-ko.md)** - 성능 최적화 기법
--   **[성능 최적화 주의사항](./docs/performance-warnings-ko.md)** - 안티패턴과 일반적인 함정
--   **[마이그레이션 가이드](./docs/migration-ko.md)** - 다른 폼 라이브러리에서 이전
--   **[useGlobalForm 가이드](./docs/useGlobalForm-guide-ko.md)** - 글로벌 폼 상태 관리
--   **[글로벌 훅 비교](./docs/global-hooks-comparison-ko.md)** - useGlobalForm vs useGlobalFormaState
--   **[라이브러리 비교](./docs/library-comparison-ko.md)** - Forma vs 다른 라이브러리
+-   **[시작 가이드](./docs/ko/getting-started.md)** - 단계별 튜토리얼과 예제
+-   **[API 레퍼런스](./docs/ko/API.md)** - 완전한 API 문서와 예제
+-   **[예제 모음](./docs/ko/examples.md)** - 실용적인 사용 예제와 패턴
+-   **[성능 최적화 가이드](./docs/ko/performance-guide.md)** - 성능 최적화 기법
+-   **[성능 최적화 주의사항](./docs/ko/performance-warnings.md)** - 안티패턴과 일반적인 함정
+-   **[마이그레이션 가이드](./docs/ko/migration.md)** - 다른 폼 라이브러리에서 이전
+-   **[useGlobalForm 가이드](./docs/ko/useGlobalForm-guide.md)** - 글로벌 폼 상태 관리
+-   **[글로벌 훅 비교](./docs/ko/global-hooks-comparison.md)** - useGlobalForm vs useGlobalFormaState
+-   **[라이브러리 비교](./docs/ko/library-comparison.md)** - Forma vs 다른 라이브러리
 
 ### Links | 링크
 
@@ -90,154 +221,102 @@ yarn add @ehfuse/forma
 
 ## Quick Start | 빠른 시작
 
-### Zero-Config Usage | Zero-Config 사용법
-
-**Start immediately without any configuration!**  
-**설정 없이 바로 시작하세요!**
-
-```tsx
-import { useForm, useFormaState } from "@ehfuse/forma";
-
-function ZeroConfigForm() {
-    // Zero-Config: Start without any parameters
-    // Zero-Config: 매개변수 없이 바로 사용
-    const form = useForm<{ name: string; email: string }>();
-
-    return (
-        <div>
-            <input
-                placeholder="Name"
-                value={form.useFormValue("name")}
-                onChange={(e) => form.setFormValue("name", e.target.value)}
-            />
-            <input
-                placeholder="Email"
-                value={form.useFormValue("email")}
-                onChange={(e) => form.setFormValue("email", e.target.value)}
-            />
-            <button onClick={() => console.log(form.getFormValues())}>
-                Log Values
-            </button>
-        </div>
-    );
-}
-
-function ZeroConfigState() {
-    // Zero-Config: General state without configuration
-    // Zero-Config: 일반 상태도 설정 없이 사용
-    const state = useFormaState<{ count: number }>();
-
-    return (
-        <div>
-            <p>Count: {state.useValue("count") || 0}</p>
-            <button
-                onClick={() =>
-                    state.setValue("count", (state.getValue("count") || 0) + 1)
-                }
-            >
-                Increment
-            </button>
-        </div>
-    );
-}
+```bash
+npm install @ehfuse/forma
 ```
 
-### Form State Management | 폼 상태 관리
+### Real-World Example: Todo App with Watch | 실전 예제: Watch를 활용한 Todo 앱
 
 ```tsx
-import { useForm } from "@ehfuse/forma";
-
-function MyForm() {
-    const form = useForm({
-        initialValues: { name: "", email: "" },
-        onValidate: async (values) => {
-            // Name validation
-            // 이름 검증
-            if (!values.name.trim()) {
-                alert("Please enter your name.");
-                return false;
-            }
-
-            // Email validation
-            // 이메일 검증
-            if (!values.email.includes("@")) {
-                alert("Please enter a valid email address.");
-                return false;
-            }
-
-            return true; // Validation passed
+import { useGlobalFormaState } from "@ehfuse/forma";
+
+// 🎯 Separate actions file for better organization
+// 액션을 별도 파일로 분리하여 코드 응집도 향상
+const todoActions = {
+    addTodo: (ctx, text: string) => {
+        const todos = ctx.values.todos;
+        ctx.setValue("todos", [
+            ...todos,
+            {
+                id: Date.now(),
+                text,
+                completed: false,
+            },
+        ]);
+    },
+
+    toggleTodo: (ctx, id: number) => {
+        const todos = ctx.values.todos.map((t) =>
+            t.id === id ? { ...t, completed: !t.completed } : t
+        );
+        ctx.setValue("todos", todos);
+    },
+
+    // Auto-save to localStorage
+    saveToStorage: (ctx) => {
+        localStorage.setItem("todos", JSON.stringify(ctx.values.todos));
+    },
+};
+
+function TodoApp() {
+    const state = useGlobalFormaState({
+        stateId: "todo-app",
+        initialValues: {
+            todos: [],
+            filter: "all",
+            lastSync: null,
         },
-        onSubmit: async (values) => {
-            console.log("Submit:", values);
+        actions: todoActions,
+        watch: {
+            // 👀 Auto-save when todos change (replaces useEffect!)
+            // todos 변경 시 자동 저장 (useEffect 불필요!)
+            todos: (ctx, value) => {
+                ctx.actions.saveToStorage(ctx);
+                ctx.setValue("lastSync", new Date().toISOString());
+            },
+
+            // 🎯 Log filter changes
+            filter: (ctx, value, prevValue) => {
+                console.log(`Filter changed: ${prevValue} → ${value}`);
+            },
         },
     });
 
-    return (
-        <form onSubmit={form.submit}>
-            <input
-                name="name"
-                value={form.useFormValue("name")}
-                onChange={form.handleFormChange}
-            />
-            <input
-                name="email"
-                value={form.useFormValue("email")}
-                onChange={form.handleFormChange}
-            />
-            <button type="submit">Submit</button>
-        </form>
-    );
-}
-```
-
-### General State Management | 일반 상태 관리
-
-```tsx
-import { useFormaState } from "@ehfuse/forma";
-
-function UserDashboard() {
-    const state = useFormaState({
-        todos: [
-            { id: 1, text: "Learn React", completed: false },
-            { id: 2, text: "Build app", completed: false },
-        ],
-        filter: "all",
-    });
-
-    // Individual field subscription - re-renders only when that field changes
-    // 개별 필드 구독 - 해당 필드가 변경될 때만 리렌더링
-    const filter = state.useValue("filter");
-
-    // ✅ Subscribe only to array length (re-renders only when items are added/removed)
-    // ✅ 배열 길이만 구독 (항목 추가/삭제 시에만 리렌더링)
+    // ✅ Surgical re-rendering: Only subscribes to what's needed
+    // 수술적 리렌더링: 필요한 것만 구독
     const todosLength = state.useValue("todos.length");
-
-    // ✅ Subscribe to specific todo text (utilizing dot notation)
-    // ✅ 특정 할 일의 텍스트만 구독 (dot notation 활용)
-    const firstTodoText = state.useValue("todos.0.text");
-
-    const addTodo = () => {
-        const todos = state.getValues().todos;
-        state.setValue("todos", [
-            ...todos,
-            { id: Date.now(), text: "New todo", completed: false },
-        ]);
-    };
+    const filter = state.useValue("filter");
+    const lastSync = state.useValue("lastSync");
 
     return (
         <div>
-            <p>Filter: {filter}</p>
-            <p>First Todo: {firstTodoText}</p>
-            <p>Total Count: {todosLength}</p>
-            <button onClick={addTodo}>Add Todo</button>
-            <button onClick={() => state.setValue("filter", "completed")}>
-                Show Completed
+            <h1>Todos ({todosLength})</h1>
+            <p>Last synced: {lastSync}</p>
+
+            <button onClick={() => state.actions.addTodo(state, "New Task")}>
+                Add Todo
             </button>
+
+            <select
+                value={filter}
+                onChange={(e) => state.setValue("filter", e.target.value)}
+            >
+                <option value="all">All</option>
+                <option value="active">Active</option>
+                <option value="completed">Completed</option>
+            </select>
         </div>
     );
 }
 ```
 
+**What you gain | 얻는 것:**
+
+-   🧹 **No useEffect** - Watch handles all side effects | useEffect 제거 - Watch가 모든 부수효과 처리
+-   📦 **Modular actions** - Easy to test and maintain | 모듈화된 액션 - 테스트와 유지보수 용이
+-   ⚡ **Optimized rendering** - Only `todosLength`, `filter`, `lastSync` trigger re-renders | 최적화된 렌더링
+-   🔄 **Automatic persistence** - Watch auto-saves changes | 자동 저장 - Watch가 변경사항 자동 저장
+
 ---
 
 ## When to choose Forma?
@@ -314,19 +393,88 @@ Forma는 **폼 상태 관리에 특화**된 라이브러리로 특정 시나리
 
 ---
 
-## Core Performance Principles | 핵심 성능 원칙
+## Architecture Benefits | 아키텍처 이점
+
+### 📁 Clean Separation of Concerns | 관심사의 명확한 분리
 
 ```tsx
-// ✅ Efficient: Individual field subscription
-// ✅ 효율적: 개별 필드 구독
-const userName = form.useFormValue("user.name");
-const userEmail = form.useFormValue("user.email");
+// actions.ts - Business logic isolated
+// actions.ts - 비즈니스 로직 분리
+export const authActions = {
+    login: async (ctx, credentials) => {
+        const user = await api.login(credentials);
+        ctx.setValues({ logined: true, user, token: user.token });
+    },
+    logout: (ctx) => {
+        ctx.setValues({ logined: false, user: null, token: null });
+    },
+    startSync: (ctx) => {
+        /* ... */
+    },
+    stopSync: (ctx) => {
+        /* ... */
+    },
+};
+
+// watch.ts - Side effects isolated
+// watch.ts - 부수효과 분리
+export const authWatch = {
+    logined: (ctx, value) => {
+        value ? ctx.actions.startSync(ctx) : ctx.actions.stopSync(ctx);
+    },
+    "user.preferences": (ctx, value) => {
+        localStorage.setItem("prefs", JSON.stringify(value));
+    },
+};
+
+// component.tsx - Pure UI
+// component.tsx - 순수 UI
+function AuthApp() {
+    const state = useGlobalFormaState({
+        stateId: "auth",
+        actions: authActions,
+        watch: authWatch,
+    });
+
+    // Clean, declarative UI
+    // 깔끔한 선언적 UI
+    return <LoginForm onSubmit={state.actions.login} />;
+}
+```
 
-// When user.name changes → Only userName field re-renders
-// user.name 변경 시 → userName 필드만 리렌더링
+**Benefits | 이점:**
+
+-   🧪 **Testable**: Test actions/watch independently | 독립적 테스트 가능
+-   📦 **Reusable**: Share logic across projects | 프로젝트 간 로직 공유
+-   🔍 **Maintainable**: Easy to locate and update logic | 로직 위치 파악 및 수정 용이
+-   👥 **Team-friendly**: Clear code organization | 명확한 코드 구조
+
+### ⚡ Performance Comparison | 성능 비교
+
+```tsx
+// ❌ Redux: Entire component re-renders
+const state = useSelector((state) => state); // Everything triggers re-render
+// 전체 컴포넌트 리렌더링
+
+// ❌ Context: All consumers re-render
+const { user, todos, settings } = useContext(AppContext);
+// 모든 컨슈머 리렌더링
+
+// ✅ Forma: Surgical precision
+const userName = state.useValue("user.name"); // Only this
+const todoCount = state.useValue("todos.length"); // Only this
+const theme = state.useValue("settings.theme"); // Only this
+// 수술적 정밀도
 ```
 
-**[View Detailed Performance Guide](./docs/performance-guide-en.md)**
+**Real-world impact | 실제 영향:**
+
+-   📊 **50+ fields**: 10-100x faster than Redux | Redux 대비 10-100배 빠름
+-   ⚡ **Real-time forms**: Smooth 60fps performance | 부드러운 60fps 성능
+-   📱 **Mobile**: Better battery life | 배터리 수명 향상
+-   🎯 **Zero wasted renders**: Every render is intentional | 모든 렌더링이 의도적
+
+**[View Detailed Performance Guide](./docs/en/performance-guide.md)** | **[성능 가이드 보기](./docs/ko/performance-guide.md)**
 
 ---
 

package/dist/core/FieldStore.d.ts

@@ -33,11 +33,16 @@
  *
  * @template T 폼 데이터의 타입 / Form data type
  */
+/**
+ * Watch 콜백 타입 / Watch callback type
+ */
+type WatchCallback = (value: any, prevValue: any) => void;
 export declare class FieldStore<T extends Record<string, any>> {
     private fields;
     private dotNotationListeners;
     private initialValues;
     private globalListeners;
+    private watchers;
     constructor(initialValues: T);
     /**
      * 특정 필드 값 가져오기 / Get specific field value
@@ -130,9 +135,45 @@ export declare class FieldStore<T extends Record<string, any>> {
      * 초기값으로 리셋 / Reset to initial values
      */
     reset(): void;
+    /**
+     * 필드 변경 감시 / Watch field changes
+     * @param path 감시할 필드 경로 (dot notation 지원) / Field path to watch (supports dot notation)
+     * @param callback 변경 시 실행할 콜백 / Callback to execute on change
+     * @param options 옵션 / Options
+     * @returns cleanup 함수 / Cleanup function
+     */
+    watch(path: string, callback: WatchCallback, options?: {
+        immediate?: boolean;
+    }): () => void;
+    /**
+     * Watcher 알림 실행 / Notify watchers
+     * @param path 변경된 필드 경로 / Changed field path
+     * @param value 새 값 / New value
+     * @param prevValue 이전 값 / Previous value
+     */
+    private notifyWatchers;
+    /**
+     * 와일드카드 패턴 매칭 / Wildcard pattern matching
+     * @param path 실제 경로 / Actual path (e.g., "todos.0.completed")
+     * @param pattern 와일드카드 패턴 / Wildcard pattern (e.g., "todos.*.completed")
+     * @returns 매칭 여부 / Whether path matches pattern
+     */
+    private matchesWildcard;
+    /**
+     * 특정 path에 watcher가 등록되어 있는지 확인 / Check if watcher is registered for specific path
+     * @param path 확인할 경로 / Path to check
+     * @returns watcher 등록 여부 / Whether watcher is registered
+     */
+    hasWatcher(path: string): boolean;
+    /**
+     * 등록된 모든 watcher path 목록 반환 (디버깅용) / Return all registered watcher paths (for debugging)
+     * @returns watcher path 배열 / Array of watcher paths
+     */
+    getWatchedPaths(): string[];
     /**
      * 리소스 정리 / Clean up resources
      */
     destroy(): void;
 }
+export {};
 //# sourceMappingURL=FieldStore.d.ts.map

package/dist/core/FieldStore.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"FieldStore.d.ts","sourceRoot":"","sources":["../../core/FieldStore.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;GA2BG;AAKH;;;;;;GAMG;AACH,qBAAa,UAAU,CAAC,CAAC,SAAS,MAAM,CAAC,MAAM,EAAE,GAAG,CAAC;IACjD,OAAO,CAAC,MAAM,CACA;IACd,OAAO,CAAC,oBAAoB,CAA2C;IACvE,OAAO,CAAC,aAAa,CAAI;IACzB,OAAO,CAAC,eAAe,CAAyB;gBAEpC,aAAa,EAAE,CAAC;IAW5B;;;;;OAKG;IACH,QAAQ,CAAC,SAAS,EAAE,MAAM,CAAC,GAAG,MAAM,GAAG,GAAG;IA8B1C;;;;;;OAMG;IACH,SAAS,CAAC,SAAS,EAAE,MAAM,CAAC,GAAG,MAAM,EAAE,QAAQ,EAAE,MAAM,IAAI;IAuD3D;;;;;OAKG;IACH,eAAe,CAAC,QAAQ,EAAE,MAAM,IAAI;IAOpC;;;;;OAKG;IACH,QAAQ,CAAC,SAAS,EAAE,MAAM,CAAC,GAAG,MAAM,EAAE,KAAK,EAAE,GAAG;IA2JhD;;;OAGG;IACH,SAAS,IAAI,CAAC;IAUd;;;OAGG;IACH,SAAS,CAAC,SAAS,EAAE,OAAO,CAAC,CAAC,CAAC;IA4B/B;;;OAGG;IACH,gBAAgB,CAAC,gBAAgB,EAAE,CAAC;IAyBpC;;;OAGG;IACH,UAAU,IAAI,OAAO;IAkBrB;;OAEG;IACH,OAAO,CAAC,iBAAiB;IAuBzB;;;;OAIG;IACH,QAAQ,CAAC,IAAI,EAAE,MAAM,GAAG,OAAO;IAU/B;;;OAGG;IACH,WAAW,CAAC,IAAI,EAAE,MAAM,GAAG,IAAI;IAyC/B;;;;OAIG;IACH,cAAc,CAAC,QAAQ,EAAE,CAAC,MAAM,EAAE,CAAC,KAAK,IAAI,GAAG,MAAM,IAAI;IAYzD;;;;OAIG;IACH,aAAa,CAAC,MAAM,EAAE,MAAM,GAAG,IAAI;IA2CnC;;;;OAIG;IACH,QAAQ,CAAC,OAAO,EAAE,MAAM,CAAC,MAAM,EAAE,GAAG,CAAC,GAAG,IAAI;IA4B5C;;;OAGG;IACH,OAAO,CAAC,qBAAqB;IAsF7B;;OAEG;IACH,KAAK;IA6DL;;OAEG;IACH,OAAO;CAKV"}
+{"version":3,"file":"FieldStore.d.ts","sourceRoot":"","sources":["../../core/FieldStore.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;GA2BG;AAKH;;;;;;GAMG;AACH;;GAEG;AACH,KAAK,aAAa,GAAG,CAAC,KAAK,EAAE,GAAG,EAAE,SAAS,EAAE,GAAG,KAAK,IAAI,CAAC;AAE1D,qBAAa,UAAU,CAAC,CAAC,SAAS,MAAM,CAAC,MAAM,EAAE,GAAG,CAAC;IACjD,OAAO,CAAC,MAAM,CACA;IACd,OAAO,CAAC,oBAAoB,CAA2C;IACvE,OAAO,CAAC,aAAa,CAAI;IACzB,OAAO,CAAC,eAAe,CAAyB;IAChD,OAAO,CAAC,QAAQ,CAA8C;gBAElD,aAAa,EAAE,CAAC;IAW5B;;;;;OAKG;IACH,QAAQ,CAAC,SAAS,EAAE,MAAM,CAAC,GAAG,MAAM,GAAG,GAAG;IA8B1C;;;;;;OAMG;IACH,SAAS,CAAC,SAAS,EAAE,MAAM,CAAC,GAAG,MAAM,EAAE,QAAQ,EAAE,MAAM,IAAI;IAuD3D;;;;;OAKG;IACH,eAAe,CAAC,QAAQ,EAAE,MAAM,IAAI;IAOpC;;;;;OAKG;IACH,QAAQ,CAAC,SAAS,EAAE,MAAM,CAAC,GAAG,MAAM,EAAE,KAAK,EAAE,GAAG;IA0KhD;;;OAGG;IACH,SAAS,IAAI,CAAC;IAUd;;;OAGG;IACH,SAAS,CAAC,SAAS,EAAE,OAAO,CAAC,CAAC,CAAC;IA4C/B;;;OAGG;IACH,gBAAgB,CAAC,gBAAgB,EAAE,CAAC;IAyBpC;;;OAGG;IACH,UAAU,IAAI,OAAO;IAkBrB;;OAEG;IACH,OAAO,CAAC,iBAAiB;IAuBzB;;;;OAIG;IACH,QAAQ,CAAC,IAAI,EAAE,MAAM,GAAG,OAAO;IAU/B;;;OAGG;IACH,WAAW,CAAC,IAAI,EAAE,MAAM,GAAG,IAAI;IAyC/B;;;;OAIG;IACH,cAAc,CAAC,QAAQ,EAAE,CAAC,MAAM,EAAE,CAAC,KAAK,IAAI,GAAG,MAAM,IAAI;IAYzD;;;;OAIG;IACH,aAAa,CAAC,MAAM,EAAE,MAAM,GAAG,IAAI;IA2CnC;;;;OAIG;IACH,QAAQ,CAAC,OAAO,EAAE,MAAM,CAAC,MAAM,EAAE,GAAG,CAAC,GAAG,IAAI;IA4B5C;;;OAGG;IACH,OAAO,CAAC,qBAAqB;IAsF7B;;OAEG;IACH,KAAK;IA6DL;;;;;;OAMG;IACH,KAAK,CACD,IAAI,EAAE,MAAM,EACZ,QAAQ,EAAE,aAAa,EACvB,OAAO,CAAC,EAAE;QAAE,SAAS,CAAC,EAAE,OAAO,CAAA;KAAE,GAClC,MAAM,IAAI;IAuBb;;;;;OAKG;IACH,OAAO,CAAC,cAAc;IAoCtB;;;;;OAKG;IACH,OAAO,CAAC,eAAe;IAoBvB;;;;OAIG;IACH,UAAU,CAAC,IAAI,EAAE,MAAM,GAAG,OAAO;IAIjC;;;OAGG;IACH,eAAe,IAAI,MAAM,EAAE;IAI3B;;OAEG;IACH,OAAO;CAMV"}