form-hook-kit 1.2.2 → 1.2.4

package/README.md

@@ -176,6 +176,60 @@ export default function App() {
 
 ---
 
+## Comprehensive Demo Applications
+
+We provide two extensive, production-ready demo applications that showcase all form-hook-kit features:
+
+### React Web Registration Demo (`examples/react-registration-demo/`)
+
+A full-featured React web application demonstrating:
+
+- **Complete Registration Form** - Multiple field types (text, email, password, number, URL, textarea, checkbox)
+- **Yup Schema Validation** - Custom error messages, required fields, format validation, length constraints
+- **Individual Field Components** - Isolated re-renders using `useFormField` hook
+- **Performance Monitoring** - Real-time metrics with `useFormPerformance` hook
+- **DevTools Integration** - Visual UI panel for debugging form state
+- **Configurable Validation Debouncing** - Adjustable delay slider (0-1000ms)
+- **Modern Stack** - Vite, React 19, TypeScript, full type safety
+
+**Run the demo:**
+```bash
+cd examples/react-registration-demo
+npm install
+npm run dev
+```
+
+### React Native Registration Demo (`examples/react-native-registration-demo.tsx`)
+
+A comprehensive React Native application demonstrating:
+
+- **Complete Registration Form** - Multiple field types (text, email, password, phone, number, textarea, checkbox)
+- **Yup Schema Validation** - Custom error messages, cross-field validation (password confirmation), format validation
+- **Individual Field Components** - Isolated re-renders using `useFormField` hook
+- **Performance Monitoring** - Real-time metrics with `useFormPerformance` and `useValidationPerformance` hooks
+- **DevTools Integration** - Console mode for React Native debugging
+- **React Native-Specific Features**:
+  - `KeyboardAvoidingView` for keyboard handling
+  - `SafeAreaView` for safe area insets
+  - Platform-specific styling (iOS/Android)
+  - Phone number formatting with custom formatter
+  - Password visibility toggle
+  - Focus management with field refs
+- **Advanced Features**:
+  - Manual validation examples
+  - Multiple values update (reset form, fill sample data)
+  - Form values and errors display
+  - Configurable validation debouncing (300ms default)
+
+**Use the demo:**
+1. Copy `examples/react-native-registration-demo.tsx` to your React Native app's `App.tsx`
+2. Install dependencies: `npm install form-hook-kit yup`
+3. Run: `npx react-native run-ios` or `npx react-native run-android`
+
+Both demos serve as excellent references for learning form-hook-kit capabilities and as production-ready starting points for your own forms.
+
+---
+
 ## API Reference
 
 For complete API documentation, advanced usage, React Native examples, and performance optimization, see [USAGE.md](./USAGE.md).

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "form-hook-kit",
-  "version": "1.2.2",
+  "version": "1.2.4",
   "description": "A type-safe form management library for React and React Native with hooks-based API, Yup validation, and 100% test coverage",
   "main": "dist/index.js",
   "module": "dist/index.esm.js",