@vuehookform/core 0.4.3 → 0.4.5

package/README.md

@@ -42,12 +42,12 @@ const onSubmit = (data) => {
 <template>
   <form @submit="handleSubmit(onSubmit)">
     <input v-bind="register('email')" type="email" />
-    <span v-if="formState.errors.email">{{ formState.errors.email }}</span>
+    <span v-if="formState.value.errors.email">{{ formState.value.errors.email }}</span>
 
     <input v-bind="register('password')" type="password" />
-    <span v-if="formState.errors.password">{{ formState.errors.password }}</span>
+    <span v-if="formState.value.errors.password">{{ formState.value.errors.password }}</span>
 
-    <button type="submit" :disabled="formState.isSubmitting">Submit</button>
+    <button type="submit" :disabled="formState.value.isSubmitting">Submit</button>
   </form>
 </template>
 ```
@@ -160,11 +160,15 @@ const emailError = computed(() => formState.value.errors.email)
 
 <!-- ✅ Option 3: Use useController for reusable components -->
 <script setup>
+import { useForm, useController, type Control } from '@vuehookform/core'
+
+// control comes from useForm (pass it as a prop to child components)
+const { control } = useForm({ schema })
 const { fieldState } = useController({ name: 'email', control })
 // fieldState is a ComputedRef that updates automatically
 </script>
 <template>
-  <span v-if="fieldState.error">{{ fieldState.error }}</span>
+  <span v-if="fieldState.value.error">{{ fieldState.value.error }}</span>
 </template>
 ```
 

package/dist/index.d.ts

@@ -20,5 +20,5 @@ export { useWatch, type UseWatchOptions } from './useWatch';
 export { useController, type UseControllerOptions, type UseControllerReturn, type ControllerFieldProps, } from './useController';
 export { useFormState, type UseFormStateOptions, type FormStateKey } from './useFormState';
 export { isFieldError } from './types';
-export type { UseFormOptions, UseFormReturn, RegisterOptions, RegisterReturn, FormState, FieldState, FieldErrors, FieldError, FieldErrorValue, ErrorOption, SetErrorsOptions, FieldArray, FieldArrayItem, FieldArrayOptions, FieldArrayRules, FieldArrayFocusOptions, InferSchema, FormValues, FormPath, Path, PathValue, ArrayElement, ArrayPath, FieldPath, ValidationMode, SetFocusOptions, ResetOptions, ResetFieldOptions, AsyncDefaultValues, TriggerOptions, SetValueOptions, UnregisterOptions, CriteriaMode, } from './types';
-export { get, set, unset, generateId, clearPathCache } from './utils/paths';
+export type { UseFormOptions, UseFormReturn, UseFormReturn as Control, RegisterOptions, RegisterReturn, FormState, FieldState, FieldErrors, FieldError, FieldErrorValue, ErrorOption, SetErrorsOptions, FieldArray, FieldArrayItem, FieldArrayOptions, FieldArrayRules, FieldArrayFocusOptions, InferSchema, FormValues, FormPath, Path, PathValue, ArrayElement, ArrayPath, FieldPath, ValidationMode, SetFocusOptions, ResetOptions, ResetFieldOptions, AsyncDefaultValues, TriggerOptions, SetValueOptions, UnregisterOptions, CriteriaMode, } from './types';
+export { get, set, unset, clearPathCache } from './utils/paths';

package/dist/utils/modeChecks.d.ts

@@ -5,11 +5,11 @@ import { ValidationMode } from '../types';
  *
  * @param mode - The form's validation mode
  * @param isTouched - Whether the field has been touched
+ * @param hasSubmitted - Whether the form has been submitted at least once (for reValidateMode)
  * @param reValidateMode - The form's reValidateMode (used after first submit)
- * @param hasSubmitted - Whether the form has been submitted at least once (optional, for reValidateMode)
  * @returns true if validation should be triggered
  */
-export declare function shouldValidateOnChange(mode: ValidationMode, isTouched: boolean, reValidateMode?: ValidationMode, hasSubmitted?: boolean): boolean;
+export declare function shouldValidateOnChange(mode: ValidationMode, isTouched: boolean, hasSubmitted?: boolean, reValidateMode?: ValidationMode): boolean;
 /**
  * Determines if validation should occur on blur event.
  * Used by useController and register for consistent mode handling.

package/dist/utils/paths.d.ts

@@ -1,3 +1,11 @@
+/**
+ * Get cached path segments or parse and cache them.
+ * Uses simple LRU eviction (delete oldest when full).
+ *
+ * Exported for use by other utilities that need path parsing
+ * with caching benefits (devWarnings, schemaExtract).
+ */
+export declare function getPathSegments(path: string): string[];
 /**
  * Clear the path segment cache.
  * Call this between SSR requests to prevent memory accumulation,

package/dist/vuehookform.cjs

@@ -28,7 +28,7 @@ function get(obj, path) {
 	return result;
 }
 function set(obj, path, value) {
-	if (!path) return;
+	if (!path || obj === null || obj === void 0) return;
 	const keys = getPathSegments(path).slice();
 	const UNSAFE_KEYS = [
 		"__proto__",
@@ -60,7 +60,7 @@ function set(obj, path, value) {
 	current[lastKey] = value;
 }
 function unset(obj, path) {
-	if (!path) return;
+	if (!path || obj === null || obj === void 0) return;
 	const keys = getPathSegments(path).slice();
 	const lastKey = keys.pop();
 	let current = obj;
@@ -118,7 +118,7 @@ function validatePathSyntax(path) {
 	return null;
 }
 function traverseSchemaPath(schema, path) {
-	const segments = path.split(".");
+	const segments = getPathSegments(path);
 	let currentSchema = schema;
 	for (let i = 0; i < segments.length; i++) {
 		const segment = segments[i];
@@ -449,7 +449,7 @@ function hasRootEffects(schema) {
 	return hasChecks(schema);
 }
 function extractSubSchema(schema, path) {
-	const segments = path.split(".");
+	const segments = getPathSegments(path);
 	let currentSchema = schema;
 	let hasEffects = false;
 	for (const segment of segments) {
@@ -800,7 +800,7 @@ var VALID_MODES = [
 function validateMode(mode, paramName) {
 	if (__DEV__ && !VALID_MODES.includes(mode)) warnOnce(`Invalid ${paramName}: "${mode}". Expected one of: ${VALID_MODES.join(", ")}`, `invalid-mode-${mode}`);
 }
-function shouldValidateOnChange(mode, isTouched, reValidateMode, hasSubmitted) {
+function shouldValidateOnChange(mode, isTouched, hasSubmitted, reValidateMode) {
 	if (__DEV__) {
 		validateMode(mode, "validation mode");
 		if (reValidateMode) validateMode(reValidateMode, "reValidateMode");
@@ -863,7 +863,7 @@ function createFieldRegistration(ctx, validate) {
 				set(ctx.formData, name, value);
 				updateFieldDirtyState(ctx.dirtyFields, ctx.defaultValues, ctx.defaultValueHashes, name, value);
 				const fieldOpts = ctx.fieldOptions.get(name);
-				if (shouldValidateOnChange(ctx.options.mode ?? "onSubmit", ctx.touchedFields.value[name] === true, ctx.options.reValidateMode, ctx.submitCount.value > 0)) {
+				if (shouldValidateOnChange(ctx.options.mode ?? "onSubmit", ctx.touchedFields.value[name] === true, ctx.submitCount.value > 0, ctx.options.reValidateMode)) {
 					const validationDebounceMs = ctx.options.validationDebounce || 0;
 					if (validationDebounceMs > 0) {
 						const existingTimer = ctx.schemaValidationTimers.get(name);
@@ -1088,7 +1088,7 @@ function createFieldArrayManager(ctx, validate, setFocus) {
 		const validateIfNeeded = () => {
 			const isTouched = ctx.touchedFields.value[name] === true;
 			const hasSubmitted = ctx.submitCount.value > 0;
-			if (shouldValidateOnChange(ctx.options.mode ?? "onSubmit", isTouched, ctx.options.reValidateMode, hasSubmitted)) validate(name);
+			if (shouldValidateOnChange(ctx.options.mode ?? "onSubmit", isTouched, hasSubmitted, ctx.options.reValidateMode)) validate(name);
 		};
 		const ensureSync = () => {
 			const currentValues = get(ctx.formData, name) || [];
@@ -1790,7 +1790,7 @@ function useController(options) {
 		const hasSubmitted = form.formState.value.submitCount > 0;
 		const mode = form.options.mode ?? "onSubmit";
 		const reValidateMode = form.options.reValidateMode;
-		const shouldValidate = shouldValidateOnChange(mode, isTouched, reValidateMode, hasSubmitted);
+		const shouldValidate = shouldValidateOnChange(mode, isTouched, hasSubmitted, reValidateMode);
 		form.setValue(name, newValue, { shouldValidate });
 	};
 	const onBlur = () => {
@@ -1844,7 +1844,6 @@ function isFieldError(error) {
 }
 exports.FormContextKey = FormContextKey;
 exports.clearPathCache = clearPathCache;
-exports.generateId = generateId;
 exports.get = get;
 exports.isFieldError = isFieldError;
 exports.provideForm = provideForm;

package/dist/vuehookform.js

@@ -27,7 +27,7 @@ function get(obj, path) {
 	return result;
 }
 function set(obj, path, value) {
-	if (!path) return;
+	if (!path || obj === null || obj === void 0) return;
 	const keys = getPathSegments(path).slice();
 	const UNSAFE_KEYS = [
 		"__proto__",
@@ -59,7 +59,7 @@ function set(obj, path, value) {
 	current[lastKey] = value;
 }
 function unset(obj, path) {
-	if (!path) return;
+	if (!path || obj === null || obj === void 0) return;
 	const keys = getPathSegments(path).slice();
 	const lastKey = keys.pop();
 	let current = obj;
@@ -116,7 +116,7 @@ function validatePathSyntax(path) {
 	return null;
 }
 function traverseSchemaPath(schema, path) {
-	const segments = path.split(".");
+	const segments = getPathSegments(path);
 	let currentSchema = schema;
 	for (let i = 0; i < segments.length; i++) {
 		const segment = segments[i];
@@ -447,7 +447,7 @@ function hasRootEffects(schema) {
 	return hasChecks(schema);
 }
 function extractSubSchema(schema, path) {
-	const segments = path.split(".");
+	const segments = getPathSegments(path);
 	let currentSchema = schema;
 	let hasEffects = false;
 	for (const segment of segments) {
@@ -798,7 +798,7 @@ var VALID_MODES = [
 function validateMode(mode, paramName) {
 	if (__DEV__ && !VALID_MODES.includes(mode)) warnOnce(`Invalid ${paramName}: "${mode}". Expected one of: ${VALID_MODES.join(", ")}`, `invalid-mode-${mode}`);
 }
-function shouldValidateOnChange(mode, isTouched, reValidateMode, hasSubmitted) {
+function shouldValidateOnChange(mode, isTouched, hasSubmitted, reValidateMode) {
 	if (__DEV__) {
 		validateMode(mode, "validation mode");
 		if (reValidateMode) validateMode(reValidateMode, "reValidateMode");
@@ -861,7 +861,7 @@ function createFieldRegistration(ctx, validate) {
 				set(ctx.formData, name, value);
 				updateFieldDirtyState(ctx.dirtyFields, ctx.defaultValues, ctx.defaultValueHashes, name, value);
 				const fieldOpts = ctx.fieldOptions.get(name);
-				if (shouldValidateOnChange(ctx.options.mode ?? "onSubmit", ctx.touchedFields.value[name] === true, ctx.options.reValidateMode, ctx.submitCount.value > 0)) {
+				if (shouldValidateOnChange(ctx.options.mode ?? "onSubmit", ctx.touchedFields.value[name] === true, ctx.submitCount.value > 0, ctx.options.reValidateMode)) {
 					const validationDebounceMs = ctx.options.validationDebounce || 0;
 					if (validationDebounceMs > 0) {
 						const existingTimer = ctx.schemaValidationTimers.get(name);
@@ -1086,7 +1086,7 @@ function createFieldArrayManager(ctx, validate, setFocus) {
 		const validateIfNeeded = () => {
 			const isTouched = ctx.touchedFields.value[name] === true;
 			const hasSubmitted = ctx.submitCount.value > 0;
-			if (shouldValidateOnChange(ctx.options.mode ?? "onSubmit", isTouched, ctx.options.reValidateMode, hasSubmitted)) validate(name);
+			if (shouldValidateOnChange(ctx.options.mode ?? "onSubmit", isTouched, hasSubmitted, ctx.options.reValidateMode)) validate(name);
 		};
 		const ensureSync = () => {
 			const currentValues = get(ctx.formData, name) || [];
@@ -1788,7 +1788,7 @@ function useController(options) {
 		const hasSubmitted = form.formState.value.submitCount > 0;
 		const mode = form.options.mode ?? "onSubmit";
 		const reValidateMode = form.options.reValidateMode;
-		const shouldValidate = shouldValidateOnChange(mode, isTouched, reValidateMode, hasSubmitted);
+		const shouldValidate = shouldValidateOnChange(mode, isTouched, hasSubmitted, reValidateMode);
 		form.setValue(name, newValue, { shouldValidate });
 	};
 	const onBlur = () => {
@@ -1840,4 +1840,4 @@ function useFormState(options = {}) {
 function isFieldError(error) {
 	return typeof error === "object" && error !== null && "type" in error && "message" in error && typeof error.type === "string" && typeof error.message === "string";
 }
-export { FormContextKey, clearPathCache, generateId, get, isFieldError, provideForm, set, unset, useController, useForm, useFormContext, useFormState, useWatch };
+export { FormContextKey, clearPathCache, get, isFieldError, provideForm, set, unset, useController, useForm, useFormContext, useFormState, useWatch };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@vuehookform/core",
-  "version": "0.4.3",
+  "version": "0.4.5",
   "description": "TypeScript-first form library for Vue 3, inspired by React Hook Form. Form-level state management with Zod validation.",
   "type": "module",
   "workspaces": [