formstand 0.8.0 → 0.9.0

package/dist/index.d.cts

@@ -67,6 +67,7 @@ type CreateFormOptions<TSchema extends z.ZodType> = Readonly<{
     mode?: ValidationMode;
     reValidateMode?: ValidationMode;
     validateOnMount?: boolean;
+    devtools?: boolean | string;
 }>;
 type SubmitHandler<TSchema extends z.ZodType> = (data: z.output<TSchema>) => void | Promise<void>;
 type InvalidSubmitHandler = (errors: ErrorMap) => void;
@@ -149,6 +150,24 @@ declare const parsePath: (path: string) => readonly PathSegment[];
 declare const getAtPath: (obj: unknown, path: string) => unknown;
 declare const setAtPath: <T>(obj: T, path: string, value: unknown) => T;
 
+type PersistStorage = Readonly<{
+    getItem: (key: string) => string | null;
+    setItem: (key: string, value: string) => void;
+    removeItem: (key: string) => void;
+}>;
+type PersistOptions<TSchema extends z.ZodType> = Readonly<{
+    key: string;
+    storage?: PersistStorage;
+    debounceMs?: number;
+    apply?: "adopt" | "restore" | "manual";
+}>;
+type PersistHandle = Readonly<{
+    restore: () => boolean;
+    clear: () => void;
+    dispose: () => void;
+}>;
+declare const persistForm: <TSchema extends z.ZodType>(form: Form<TSchema>, options: PersistOptions<TSchema>) => PersistHandle;
+
 declare const useForm: <TSchema extends z.ZodType>(schema: TSchema, options: CreateFormOptions<TSchema>) => Form<TSchema>;
 
 type FormProviderProps<TSchema extends z.ZodType> = Readonly<{
@@ -198,6 +217,16 @@ declare function useField<TValue = unknown>(form: FieldFormApi & {
 }, path: string | ((state: FormState<unknown>) => string), options?: UseFieldOptions): UseFieldReturn<TValue>;
 declare function useField<TSchema extends z.ZodType, P extends FieldPath<z.input<TSchema>>>(form: Form<TSchema>, path: P, options?: UseFieldOptions): UseFieldReturn<FieldValue<z.input<TSchema>, P>>;
 
+type VariantFieldValue<V, TField extends string> = V extends unknown ? TField extends keyof V ? V[TField] : never : never;
+type CommonKeys<V> = keyof V;
+type AllKeys<V> = V extends unknown ? keyof V : never;
+type VariantKeys<V> = Exclude<AllKeys<V>, CommonKeys<V>> & string;
+type UnionValueAt<TValues, P extends string> = P extends keyof TValues ? NonNullable<TValues[P]> : P extends `${infer Head}.${infer Tail}` ? Head extends keyof TValues ? UnionValueAt<NonNullable<TValues[Head]>, Tail> : never : never;
+declare function useVariantField<TSchema extends z.ZodType, P extends string, TField extends VariantKeys<UnionValueAt<z.input<TSchema>, P>>>(form: Form<TSchema>, unionPath: P, field: TField): UseFieldReturn<VariantFieldValue<UnionValueAt<z.input<TSchema>, P>, TField> | undefined>;
+declare function useVariantField<TValue = unknown>(form: FieldFormApi & {
+    readonly schema?: undefined;
+}, unionPath: string, field: string): UseFieldReturn<TValue | undefined>;
+
 type ReadonlyStore$1<T> = Pick<StoreApi<T>, "getState" | "getInitialState" | "subscribe">;
 type FieldArrayFormApi = Readonly<{
     store: ReadonlyStore$1<FormState<unknown>>;
@@ -233,6 +262,7 @@ type BoundUseField<TSchema extends z.ZodType> = {
     (pathSelector: (state: FormState<z.input<TSchema>>) => string, options?: UseFieldOptions): UseFieldReturn<unknown>;
     <P extends FieldPath<z.input<TSchema>>>(path: P, options?: UseFieldOptions): UseFieldReturn<FieldValue<z.input<TSchema>, P>>;
 };
+type BoundUseVariantField<TSchema extends z.ZodType> = <P extends string, TField extends VariantKeys<UnionValueAt<z.input<TSchema>, P>>>(unionPath: P, field: TField) => UseFieldReturn<VariantFieldValue<UnionValueAt<z.input<TSchema>, P>, TField> | undefined>;
 type BoundUseFieldArray<TSchema extends z.ZodType> = {
     (pathSelector: (state: FormState<z.input<TSchema>>) => string): UseFieldArrayReturn<unknown>;
     <P extends FieldPath<z.input<TSchema>>>(path: P): UseFieldArrayReturn<ArrayItemOf<FieldValue<z.input<TSchema>, P>>>;
@@ -241,6 +271,8 @@ type BoundUseSelector<TSchema extends z.ZodType> = <U>(selector: (state: FormSta
 type BoundUseFlag<TSchema extends z.ZodType> = (path?: FieldPath<z.input<TSchema>>) => boolean;
 type FormHooks<TSchema extends z.ZodType, N extends string> = Readonly<{
     [K in `use${Capitalize<N>}Field`]: BoundUseField<TSchema>;
+} & {
+    [K in `use${Capitalize<N>}VariantField`]: BoundUseVariantField<TSchema>;
 } & {
     [K in `use${Capitalize<N>}FieldArray`]: BoundUseFieldArray<TSchema>;
 } & {
@@ -300,6 +332,15 @@ type TextFieldProps<F extends FieldFormApi = FieldFormApi> = Readonly<{
     ref?: FieldRef<HTMLInputElement>;
 }>;
 declare const TextField: <F extends FieldFormApi>({ form, path, label, placeholder, type, autoComplete, ref, }: TextFieldProps<F>) => react.JSX.Element;
+type DateFieldProps<F extends FieldFormApi = FieldFormApi> = Readonly<{
+    form: F;
+    path: PathsOf<F>;
+    label?: ReactNode;
+    min?: string;
+    max?: string;
+    ref?: FieldRef<HTMLInputElement>;
+}>;
+declare const DateField: <F extends FieldFormApi>({ form, path, label, min, max, ref, }: DateFieldProps<F>) => react.JSX.Element;
 type NumberFieldProps<F extends FieldFormApi = FieldFormApi> = Readonly<{
     form: F;
     path: PathsOf<F>;
@@ -347,6 +388,14 @@ type NumberInputProps = Readonly<{
     onChange: (e: ChangeEvent<HTMLInputElement>) => void;
     onBlur: () => void;
 }>;
+type DateInputProps = Readonly<{
+    type: "date";
+    name: string;
+    value: string;
+    "aria-invalid": true | undefined;
+    onChange: (e: ChangeEvent<HTMLInputElement>) => void;
+    onBlur: () => void;
+}>;
 type CheckboxProps = Readonly<{
     type: "checkbox";
     name: string;
@@ -374,7 +423,18 @@ type ParsedNumberText = Readonly<{
 declare const parseNumberText: (text: string) => ParsedNumberText;
 declare const textInputProps: <T extends string | null | undefined>(field: UseFieldReturn<T>) => TextInputProps;
 declare const numberInputProps: <T extends number | null | undefined>(field: UseFieldReturn<T>) => NumberInputProps;
+declare const dateToInputText: (value: Date | null | undefined) => string;
+type ParsedDateText = Readonly<{
+    kind: "empty";
+}> | Readonly<{
+    kind: "date";
+    value: Date;
+}> | Readonly<{
+    kind: "invalid";
+}>;
+declare const parseDateText: (text: string) => ParsedDateText;
+declare const dateInputProps: <T extends Date | null | undefined>(field: UseFieldReturn<T>) => DateInputProps;
 declare const checkboxProps: <T extends boolean | null | undefined>(field: UseFieldReturn<T>) => CheckboxProps;
 declare const selectProps: <T extends string | null | undefined>(field: UseFieldReturn<T>) => SelectProps;
 
-export { type BoolMap, type BoundUseField, type BoundUseFieldArray, type BoundUseFlag, type BoundUseSelector, CheckboxField, type CheckboxFieldProps, type CheckboxProps, type CreateFormOptions, type ErrorMap, type FieldArrayEntry, type FieldArrayFormApi, type FieldFormApi, type FieldPath, type FieldPathArg, type FieldRef, type FieldSnapshot, type FieldValidationResult, type FieldValue, type Form, type FormContextApi, type FormHooks, type FormProviderProps, type FormState, type FormStateApi, type InvalidSubmitHandler, NumberField, type NumberFieldProps, type NumberInputProps, type ParsedNumberText, type PathSegment, type PathsOf, type ReadonlyStoreApi, type ResetOptions, SelectField, type SelectFieldOption, type SelectFieldProps, type SelectProps, type SettledFieldValidationResult, type SettledValidationResult, type SubmitHandler, type SubmitOptions, type SubmitResult, TextField, type TextFieldProps, type TextInputProps, type UseFieldArrayReturn, type UseFieldOptions, type UseFieldReturn, type ValidationMode, type ValidationResult, type ValidationTrigger, checkboxProps, createForm, createFormContext, createFormHooks, emptyValueForSchema, flattenIssues, focusField, focusFirstError, getAtPath, isAsyncRequiredError, numberInputProps, numberToInputText, parseNumberText, parsePath, selectProps, setAtPath, shouldValidateOn, textInputProps, useField, useFieldArray, useForm, useFormError, useFormSelector, useFormSelectorShallow, useIsDirty, useIsSubmitting, useIsValid, useSubmitCount, validateAsync, validateSync };
+export { type BoolMap, type BoundUseField, type BoundUseFieldArray, type BoundUseFlag, type BoundUseSelector, CheckboxField, type CheckboxFieldProps, type CheckboxProps, type CreateFormOptions, DateField, type DateFieldProps, type DateInputProps, type ErrorMap, type FieldArrayEntry, type FieldArrayFormApi, type FieldFormApi, type FieldPath, type FieldPathArg, type FieldRef, type FieldSnapshot, type FieldValidationResult, type FieldValue, type Form, type FormContextApi, type FormHooks, type FormProviderProps, type FormState, type FormStateApi, type InvalidSubmitHandler, NumberField, type NumberFieldProps, type NumberInputProps, type ParsedDateText, type ParsedNumberText, type PathSegment, type PathsOf, type PersistHandle, type PersistOptions, type PersistStorage, type ReadonlyStoreApi, type ResetOptions, SelectField, type SelectFieldOption, type SelectFieldProps, type SelectProps, type SettledFieldValidationResult, type SettledValidationResult, type SubmitHandler, type SubmitOptions, type SubmitResult, TextField, type TextFieldProps, type TextInputProps, type UseFieldArrayReturn, type UseFieldOptions, type UseFieldReturn, type ValidationMode, type ValidationResult, type ValidationTrigger, checkboxProps, createForm, createFormContext, createFormHooks, dateInputProps, dateToInputText, emptyValueForSchema, flattenIssues, focusField, focusFirstError, getAtPath, isAsyncRequiredError, numberInputProps, numberToInputText, parseDateText, parseNumberText, parsePath, persistForm, selectProps, setAtPath, shouldValidateOn, textInputProps, useField, useFieldArray, useForm, useFormError, useFormSelector, useFormSelectorShallow, useIsDirty, useIsSubmitting, useIsValid, useSubmitCount, useVariantField, validateAsync, validateSync };

package/dist/index.d.ts

@@ -67,6 +67,7 @@ type CreateFormOptions<TSchema extends z.ZodType> = Readonly<{
     mode?: ValidationMode;
     reValidateMode?: ValidationMode;
     validateOnMount?: boolean;
+    devtools?: boolean | string;
 }>;
 type SubmitHandler<TSchema extends z.ZodType> = (data: z.output<TSchema>) => void | Promise<void>;
 type InvalidSubmitHandler = (errors: ErrorMap) => void;
@@ -149,6 +150,24 @@ declare const parsePath: (path: string) => readonly PathSegment[];
 declare const getAtPath: (obj: unknown, path: string) => unknown;
 declare const setAtPath: <T>(obj: T, path: string, value: unknown) => T;
 
+type PersistStorage = Readonly<{
+    getItem: (key: string) => string | null;
+    setItem: (key: string, value: string) => void;
+    removeItem: (key: string) => void;
+}>;
+type PersistOptions<TSchema extends z.ZodType> = Readonly<{
+    key: string;
+    storage?: PersistStorage;
+    debounceMs?: number;
+    apply?: "adopt" | "restore" | "manual";
+}>;
+type PersistHandle = Readonly<{
+    restore: () => boolean;
+    clear: () => void;
+    dispose: () => void;
+}>;
+declare const persistForm: <TSchema extends z.ZodType>(form: Form<TSchema>, options: PersistOptions<TSchema>) => PersistHandle;
+
 declare const useForm: <TSchema extends z.ZodType>(schema: TSchema, options: CreateFormOptions<TSchema>) => Form<TSchema>;
 
 type FormProviderProps<TSchema extends z.ZodType> = Readonly<{
@@ -198,6 +217,16 @@ declare function useField<TValue = unknown>(form: FieldFormApi & {
 }, path: string | ((state: FormState<unknown>) => string), options?: UseFieldOptions): UseFieldReturn<TValue>;
 declare function useField<TSchema extends z.ZodType, P extends FieldPath<z.input<TSchema>>>(form: Form<TSchema>, path: P, options?: UseFieldOptions): UseFieldReturn<FieldValue<z.input<TSchema>, P>>;
 
+type VariantFieldValue<V, TField extends string> = V extends unknown ? TField extends keyof V ? V[TField] : never : never;
+type CommonKeys<V> = keyof V;
+type AllKeys<V> = V extends unknown ? keyof V : never;
+type VariantKeys<V> = Exclude<AllKeys<V>, CommonKeys<V>> & string;
+type UnionValueAt<TValues, P extends string> = P extends keyof TValues ? NonNullable<TValues[P]> : P extends `${infer Head}.${infer Tail}` ? Head extends keyof TValues ? UnionValueAt<NonNullable<TValues[Head]>, Tail> : never : never;
+declare function useVariantField<TSchema extends z.ZodType, P extends string, TField extends VariantKeys<UnionValueAt<z.input<TSchema>, P>>>(form: Form<TSchema>, unionPath: P, field: TField): UseFieldReturn<VariantFieldValue<UnionValueAt<z.input<TSchema>, P>, TField> | undefined>;
+declare function useVariantField<TValue = unknown>(form: FieldFormApi & {
+    readonly schema?: undefined;
+}, unionPath: string, field: string): UseFieldReturn<TValue | undefined>;
+
 type ReadonlyStore$1<T> = Pick<StoreApi<T>, "getState" | "getInitialState" | "subscribe">;
 type FieldArrayFormApi = Readonly<{
     store: ReadonlyStore$1<FormState<unknown>>;
@@ -233,6 +262,7 @@ type BoundUseField<TSchema extends z.ZodType> = {
     (pathSelector: (state: FormState<z.input<TSchema>>) => string, options?: UseFieldOptions): UseFieldReturn<unknown>;
     <P extends FieldPath<z.input<TSchema>>>(path: P, options?: UseFieldOptions): UseFieldReturn<FieldValue<z.input<TSchema>, P>>;
 };
+type BoundUseVariantField<TSchema extends z.ZodType> = <P extends string, TField extends VariantKeys<UnionValueAt<z.input<TSchema>, P>>>(unionPath: P, field: TField) => UseFieldReturn<VariantFieldValue<UnionValueAt<z.input<TSchema>, P>, TField> | undefined>;
 type BoundUseFieldArray<TSchema extends z.ZodType> = {
     (pathSelector: (state: FormState<z.input<TSchema>>) => string): UseFieldArrayReturn<unknown>;
     <P extends FieldPath<z.input<TSchema>>>(path: P): UseFieldArrayReturn<ArrayItemOf<FieldValue<z.input<TSchema>, P>>>;
@@ -241,6 +271,8 @@ type BoundUseSelector<TSchema extends z.ZodType> = <U>(selector: (state: FormSta
 type BoundUseFlag<TSchema extends z.ZodType> = (path?: FieldPath<z.input<TSchema>>) => boolean;
 type FormHooks<TSchema extends z.ZodType, N extends string> = Readonly<{
     [K in `use${Capitalize<N>}Field`]: BoundUseField<TSchema>;
+} & {
+    [K in `use${Capitalize<N>}VariantField`]: BoundUseVariantField<TSchema>;
 } & {
     [K in `use${Capitalize<N>}FieldArray`]: BoundUseFieldArray<TSchema>;
 } & {
@@ -300,6 +332,15 @@ type TextFieldProps<F extends FieldFormApi = FieldFormApi> = Readonly<{
     ref?: FieldRef<HTMLInputElement>;
 }>;
 declare const TextField: <F extends FieldFormApi>({ form, path, label, placeholder, type, autoComplete, ref, }: TextFieldProps<F>) => react.JSX.Element;
+type DateFieldProps<F extends FieldFormApi = FieldFormApi> = Readonly<{
+    form: F;
+    path: PathsOf<F>;
+    label?: ReactNode;
+    min?: string;
+    max?: string;
+    ref?: FieldRef<HTMLInputElement>;
+}>;
+declare const DateField: <F extends FieldFormApi>({ form, path, label, min, max, ref, }: DateFieldProps<F>) => react.JSX.Element;
 type NumberFieldProps<F extends FieldFormApi = FieldFormApi> = Readonly<{
     form: F;
     path: PathsOf<F>;
@@ -347,6 +388,14 @@ type NumberInputProps = Readonly<{
     onChange: (e: ChangeEvent<HTMLInputElement>) => void;
     onBlur: () => void;
 }>;
+type DateInputProps = Readonly<{
+    type: "date";
+    name: string;
+    value: string;
+    "aria-invalid": true | undefined;
+    onChange: (e: ChangeEvent<HTMLInputElement>) => void;
+    onBlur: () => void;
+}>;
 type CheckboxProps = Readonly<{
     type: "checkbox";
     name: string;
@@ -374,7 +423,18 @@ type ParsedNumberText = Readonly<{
 declare const parseNumberText: (text: string) => ParsedNumberText;
 declare const textInputProps: <T extends string | null | undefined>(field: UseFieldReturn<T>) => TextInputProps;
 declare const numberInputProps: <T extends number | null | undefined>(field: UseFieldReturn<T>) => NumberInputProps;
+declare const dateToInputText: (value: Date | null | undefined) => string;
+type ParsedDateText = Readonly<{
+    kind: "empty";
+}> | Readonly<{
+    kind: "date";
+    value: Date;
+}> | Readonly<{
+    kind: "invalid";
+}>;
+declare const parseDateText: (text: string) => ParsedDateText;
+declare const dateInputProps: <T extends Date | null | undefined>(field: UseFieldReturn<T>) => DateInputProps;
 declare const checkboxProps: <T extends boolean | null | undefined>(field: UseFieldReturn<T>) => CheckboxProps;
 declare const selectProps: <T extends string | null | undefined>(field: UseFieldReturn<T>) => SelectProps;
 
-export { type BoolMap, type BoundUseField, type BoundUseFieldArray, type BoundUseFlag, type BoundUseSelector, CheckboxField, type CheckboxFieldProps, type CheckboxProps, type CreateFormOptions, type ErrorMap, type FieldArrayEntry, type FieldArrayFormApi, type FieldFormApi, type FieldPath, type FieldPathArg, type FieldRef, type FieldSnapshot, type FieldValidationResult, type FieldValue, type Form, type FormContextApi, type FormHooks, type FormProviderProps, type FormState, type FormStateApi, type InvalidSubmitHandler, NumberField, type NumberFieldProps, type NumberInputProps, type ParsedNumberText, type PathSegment, type PathsOf, type ReadonlyStoreApi, type ResetOptions, SelectField, type SelectFieldOption, type SelectFieldProps, type SelectProps, type SettledFieldValidationResult, type SettledValidationResult, type SubmitHandler, type SubmitOptions, type SubmitResult, TextField, type TextFieldProps, type TextInputProps, type UseFieldArrayReturn, type UseFieldOptions, type UseFieldReturn, type ValidationMode, type ValidationResult, type ValidationTrigger, checkboxProps, createForm, createFormContext, createFormHooks, emptyValueForSchema, flattenIssues, focusField, focusFirstError, getAtPath, isAsyncRequiredError, numberInputProps, numberToInputText, parseNumberText, parsePath, selectProps, setAtPath, shouldValidateOn, textInputProps, useField, useFieldArray, useForm, useFormError, useFormSelector, useFormSelectorShallow, useIsDirty, useIsSubmitting, useIsValid, useSubmitCount, validateAsync, validateSync };
+export { type BoolMap, type BoundUseField, type BoundUseFieldArray, type BoundUseFlag, type BoundUseSelector, CheckboxField, type CheckboxFieldProps, type CheckboxProps, type CreateFormOptions, DateField, type DateFieldProps, type DateInputProps, type ErrorMap, type FieldArrayEntry, type FieldArrayFormApi, type FieldFormApi, type FieldPath, type FieldPathArg, type FieldRef, type FieldSnapshot, type FieldValidationResult, type FieldValue, type Form, type FormContextApi, type FormHooks, type FormProviderProps, type FormState, type FormStateApi, type InvalidSubmitHandler, NumberField, type NumberFieldProps, type NumberInputProps, type ParsedDateText, type ParsedNumberText, type PathSegment, type PathsOf, type PersistHandle, type PersistOptions, type PersistStorage, type ReadonlyStoreApi, type ResetOptions, SelectField, type SelectFieldOption, type SelectFieldProps, type SelectProps, type SettledFieldValidationResult, type SettledValidationResult, type SubmitHandler, type SubmitOptions, type SubmitResult, TextField, type TextFieldProps, type TextInputProps, type UseFieldArrayReturn, type UseFieldOptions, type UseFieldReturn, type ValidationMode, type ValidationResult, type ValidationTrigger, checkboxProps, createForm, createFormContext, createFormHooks, dateInputProps, dateToInputText, emptyValueForSchema, flattenIssues, focusField, focusFirstError, getAtPath, isAsyncRequiredError, numberInputProps, numberToInputText, parseDateText, parseNumberText, parsePath, persistForm, selectProps, setAtPath, shouldValidateOn, textInputProps, useField, useFieldArray, useForm, useFormError, useFormSelector, useFormSelectorShallow, useIsDirty, useIsSubmitting, useIsValid, useSubmitCount, useVariantField, validateAsync, validateSync };

package/dist/index.js

@@ -1,4 +1,5 @@
 import { createStore } from 'zustand/vanilla';
+import { devtools } from 'zustand/middleware';
 import { z } from 'zod';
 import { useRef, useEffect, createContext, useMemo, useCallback, useState, useId, useContext } from 'react';
 import { jsxs, jsx } from 'react/jsx-runtime';
@@ -85,7 +86,18 @@ var isIndexSegment = (s) => {
   const n = Number(s);
   return Number.isInteger(n) && n >= 0 && String(n) === s;
 };
-var parsePath = (path) => path === "" ? [] : path.split(".").map((s) => isIndexSegment(s) ? Number(s) : s);
+var PARSE_CACHE_MAX = 4096;
+var parseCache = /* @__PURE__ */ new Map();
+var parsePath = (path) => {
+  const cached = parseCache.get(path);
+  if (cached !== void 0) return cached;
+  const segments = Object.freeze(
+    path === "" ? [] : path.split(".").map((s) => isIndexSegment(s) ? Number(s) : s)
+  );
+  if (parseCache.size >= PARSE_CACHE_MAX) parseCache.clear();
+  parseCache.set(path, segments);
+  return segments;
+};
 var isPlainRecord = (value) => value !== null && typeof value === "object" && !Array.isArray(value);
 var readSegment = (obj, segment) => {
   if (obj == null) return void 0;
@@ -98,8 +110,9 @@ var getAtPath = (obj, path) => parsePath(path).reduce(readSegment, obj);
 var slotAtPath = (obj, path) => {
   const walked = parsePath(path).reduce(
     (acc, segment) => {
-      const outOfBounds = typeof segment === "number" && (Array.isArray(acc.current) ? segment >= acc.current.length : !isPlainRecord(acc.current));
-      return !acc.ok || outOfBounds ? { ok: false, current: void 0 } : { ok: true, current: readSegment(acc.current, segment) };
+      const container = acc.current;
+      const addressable = typeof segment === "number" ? Array.isArray(container) ? segment < container.length : isPlainRecord(container) : isPlainRecord(container);
+      return !acc.ok || !addressable ? { ok: false, current: void 0 } : { ok: true, current: readSegment(container, segment) };
     },
     { ok: true, current: obj }
   );
@@ -263,7 +276,7 @@ var releaseAncestorEntries = (map, path) => {
   return kept.length === entries.length ? map : Object.fromEntries(kept);
 };
 var dirtyPathsOf = (values, initial, prefix) => {
-  if (valuesEqual(values, initial)) return [];
+  if (Object.is(values, initial)) return [];
   if (isPlainObject(values) && isPlainObject(initial)) {
     const keys = /* @__PURE__ */ new Set([...Object.keys(values), ...Object.keys(initial)]);
     const childPaths = [...keys].flatMap(
@@ -273,9 +286,11 @@ var dirtyPathsOf = (values, initial, prefix) => {
         prefix === "" ? k : `${prefix}.${k}`
       )
     );
-    return childPaths.length > 0 ? childPaths : [prefix];
+    if (childPaths.length > 0) return childPaths;
+    const sameKeySet = Object.keys(values).length === Object.keys(initial).length && Object.keys(values).every((k) => Object.hasOwn(initial, k));
+    return sameKeySet ? [] : [prefix];
   }
-  return [prefix];
+  return valuesEqual(values, initial) ? [] : [prefix];
 };
 var FORM_SEQ_KEY = "__form__";
 var SUBMIT_SEQ_KEY = "__submit__";
@@ -337,7 +352,18 @@ var createForm = (schema, options) => {
     mode: initialMode,
     reValidateMode: initialReValidateMode
   };
-  const store = createStore(() => initial);
+  const store = options.devtools === void 0 || options.devtools === false ? createStore(() => initial) : createStore()(
+    devtools(() => initial, {
+      name: typeof options.devtools === "string" ? options.devtools : "formstand",
+      // Non-production only, matching zustand's own devtools default:
+      // opting in during development must NOT stream every keystroke to
+      // an end user who happens to have the extension installed, where
+      // a module-singleton form's unbounded time-travel history is a
+      // real memory + serialization cost. Guarded for environments
+      // without process (a bundler defines NODE_ENV in real dev).
+      enabled: typeof process !== "undefined" && process.env?.["NODE_ENV"] !== "production"
+    })
+  );
   const commitFullPass = (state, next) => errorChannels(state, {
     schemaErrors: reuseErrorRefs(next, state.schemaErrors)
   });
@@ -366,7 +392,38 @@ var createForm = (schema, options) => {
       return result.kind === "pending" ? result.promise.then((r) => r.kind === "valid") : result.kind === "valid";
     }
     try {
-      const result = validateSync(schema, store.getState().values);
+      const values = store.getState().values;
+      const scopes = paths.map((path) => ({
+        path,
+        scope: fieldScopeFor(path, values)
+      }));
+      if (scopes.every(
+        ({ scope }) => scope.kind === "skip" || scope.kind === "parse" && scope.viaSubschema
+      )) {
+        const merged = scopes.reduce(
+          (acc, { path, scope }) => scope.kind === "skip" ? acc : {
+            ...acc,
+            ...scopeSettledResult(
+              validateSync(scope.schema, scope.value),
+              path,
+              true
+            )
+          },
+          {}
+        );
+        store.setState((state) => ({
+          ...state,
+          ...errorChannels(state, {
+            schemaErrors: reuseErrorRefs(
+              mergeScopedErrors(state.schemaErrors, merged, paths),
+              state.schemaErrors
+            ),
+            serverErrors: omitScope(state.serverErrors, paths)
+          })
+        }));
+        return Object.values(merged).flat().length === 0;
+      }
+      const result = validateSync(schema, values);
       const fullErrors = result.kind === "invalid" ? result.errors : emptyErrors;
       store.setState((state) => ({
         ...state,
@@ -966,6 +1023,74 @@ var shouldValidateOn = (trigger, mode, reValidateMode, submitAttempted, touched
       return true;
   }
 };
+
+// src/core/persist.ts
+var defaultStorage = () => {
+  try {
+    return typeof globalThis.localStorage === "undefined" ? null : globalThis.localStorage;
+  } catch {
+    return null;
+  }
+};
+var persistForm = (form, options) => {
+  const storage = options.storage ?? defaultStorage();
+  const debounceMs = options.debounceMs ?? 300;
+  const apply = options.apply ?? "adopt";
+  const applyDraft = (values) => apply === "restore" ? form.setValues(values) : form.adoptValues(values);
+  const restore = () => {
+    try {
+      const raw = storage === null ? null : storage.getItem(options.key);
+      if (raw === null) return false;
+      applyDraft(JSON.parse(raw));
+      return true;
+    } catch {
+      return false;
+    }
+  };
+  const writeDraft = (values) => {
+    try {
+      storage?.setItem(options.key, JSON.stringify(values));
+    } catch {
+    }
+  };
+  const timerRef = {
+    current: null
+  };
+  const cancelPending = () => {
+    if (timerRef.current !== null) {
+      clearTimeout(timerRef.current);
+      timerRef.current = null;
+    }
+  };
+  if (apply !== "manual") {
+    restore();
+  }
+  const unsubscribe = form.watchValues((values) => {
+    cancelPending();
+    if (debounceMs === 0) {
+      writeDraft(values);
+    } else {
+      timerRef.current = setTimeout(() => {
+        timerRef.current = null;
+        writeDraft(values);
+      }, debounceMs);
+    }
+  });
+  return Object.freeze({
+    restore,
+    clear: () => {
+      cancelPending();
+      try {
+        storage?.removeItem(options.key);
+      } catch {
+      }
+    },
+    dispose: () => {
+      cancelPending();
+      unsubscribe();
+    }
+  });
+};
 var useForm = (schema, options) => {
   const formRef = useRef(null);
   if (formRef.current === null) {
@@ -1128,6 +1253,14 @@ function useField(form, pathArg, options) {
     [slice, emptyValue, setValue, setTouched, setError, clearError, validate, validateAsync2, onBlur]
   );
 }
+
+// src/react/useVariantField.ts
+function useVariantField(form, unionPath, field) {
+  return useField(
+    form,
+    `${unionPath}.${field}`
+  );
+}
 var EMPTY_ID_STATE = { items: [], ids: [], counter: 0 };
 var EMPTY_ITEMS = [];
 var reconcileIds = (prev, nextItems) => {
@@ -1269,6 +1402,11 @@ var capitalize = (name) => name.length === 0 ? name : name.charAt(0).toUpperCase
 var createFormHooks = (form, name) => {
   const structural = form;
   const useBoundField = (path, options) => useField(structural, path, options);
+  const useBoundVariantField = (unionPath, field) => useVariantField(
+    structural,
+    unionPath,
+    field
+  );
   const useBoundFieldArray = (path) => useFieldArray(structural, path);
   const useBoundSelector = (selector) => useFormSelector(structural, selector);
   const useBoundSelectorShallow = (selector) => useFormSelectorShallow(structural, selector);
@@ -1280,6 +1418,7 @@ var createFormHooks = (form, name) => {
   const prefix = capitalize(name ?? "");
   return {
     [`use${prefix}Field`]: useBoundField,
+    [`use${prefix}VariantField`]: useBoundVariantField,
     [`use${prefix}FieldArray`]: useBoundFieldArray,
     [`use${prefix}Selector`]: useBoundSelector,
     [`use${prefix}SelectorShallow`]: useBoundSelectorShallow,
@@ -1324,6 +1463,48 @@ var numberInputProps = (field) => ({
   },
   onBlur: field.onBlur
 });
+var dateToInputText = (value) => {
+  if (value === void 0 || value === null || Number.isNaN(value.getTime())) {
+    return "";
+  }
+  const pad = (part) => String(part).padStart(2, "0");
+  return `${String(value.getFullYear()).padStart(4, "0")}-${pad(value.getMonth() + 1)}-${pad(value.getDate())}`;
+};
+var parseDateText = (text) => {
+  if (text.trim() === "") return { kind: "empty" };
+  const match = /^(\d{4})-(\d{2})-(\d{2})$/.exec(text);
+  if (match === null) return { kind: "invalid" };
+  const [, year, month, day] = match;
+  const y = Number(year);
+  const date = new Date(y, Number(month) - 1, Number(day));
+  if (y < 100) date.setFullYear(y);
+  return date.getFullYear() === y && date.getMonth() === Number(month) - 1 && date.getDate() === Number(day) ? { kind: "date", value: date } : { kind: "invalid" };
+};
+var dateInputProps = (field) => ({
+  type: "date",
+  name: field.path,
+  value: dateToInputText(field.value),
+  "aria-invalid": ariaInvalid(field),
+  onChange: (e) => {
+    const parsed = parseDateText(e.target.value);
+    if (parsed.kind !== "date") {
+      field.setValue(field.emptyValue);
+      return;
+    }
+    const current = field.value;
+    const next = current instanceof Date && !Number.isNaN(current.getTime()) ? new Date(
+      parsed.value.getFullYear(),
+      parsed.value.getMonth(),
+      parsed.value.getDate(),
+      current.getHours(),
+      current.getMinutes(),
+      current.getSeconds(),
+      current.getMilliseconds()
+    ) : parsed.value;
+    field.setValue(next);
+  },
+  onBlur: field.onBlur
+});
 var checkboxProps = (field) => ({
   type: "checkbox",
   name: field.path,
@@ -1378,6 +1559,33 @@ var TextField = ({
     /* @__PURE__ */ jsx(ErrorText, { id: errorId, error: field.error })
   ] });
 };
+var DateField = ({
+  form,
+  path,
+  label,
+  min,
+  max,
+  ref
+}) => {
+  const id = useId();
+  const errorId = `${id}-error`;
+  const field = useField(form, path);
+  return /* @__PURE__ */ jsxs("div", { className: "zf-field", children: [
+    label !== void 0 ? /* @__PURE__ */ jsx("label", { htmlFor: id, className: "zf-label", children: label }) : null,
+    /* @__PURE__ */ jsx(
+      "input",
+      {
+        id,
+        ref,
+        ...dateInputProps(field),
+        min,
+        max,
+        "aria-describedby": hasError(field.error) ? errorId : void 0
+      }
+    ),
+    /* @__PURE__ */ jsx(ErrorText, { id: errorId, error: field.error })
+  ] });
+};
 var IDLE_EDIT = { raw: null, pushed: void 0 };
 var useNumberInput = (field) => {
   const [edit, setEdit] = useState(IDLE_EDIT);
@@ -1507,13 +1715,12 @@ var SelectField = ({
 };
 
 // src/react/focusError.ts
-var focusableControls = (scope) => [
+var namedControls = (scope) => [
   ...scope.querySelectorAll(
     "input[name], select[name], textarea[name]"
   )
-].filter(
-  (el) => !el.matches(':disabled, [type="hidden"]') && el.closest("dialog:not([open])") === null
-);
+];
+var isFocusCandidate = (el) => !el.matches(':disabled, [type="hidden"]') && el.closest("dialog:not([open])") === null;
 var holdsFocus = (el) => {
   const rootNode = el.getRootNode();
   const active = rootNode instanceof Document || rootNode instanceof ShadowRoot ? rootNode.activeElement : document.activeElement;
@@ -1533,19 +1740,19 @@ var focusFirstError = (errors, root) => {
     (k) => k !== "" && (errors[k]?.length ?? 0) > 0
   );
   const hasRootError = (errors[""]?.length ?? 0) > 0;
-  const controls = focusableControls(scope);
-  const fieldMatches = controls.filter(
-    (el) => nameMatchesAny(el, erroredPaths)
-  );
+  const controls = namedControls(scope);
+  const fieldMatches = controls.filter((el) => nameMatchesAny(el, erroredPaths)).filter(isFocusCandidate);
   const rootFallbackApplies = hasRootError && (root !== void 0 || document.querySelectorAll("form").length <= 1);
-  const candidates = fieldMatches.length > 0 ? fieldMatches : rootFallbackApplies ? controls : [];
+  const candidates = fieldMatches.length > 0 ? fieldMatches : rootFallbackApplies ? controls.filter(isFocusCandidate) : [];
   return focusFirstOf(candidates);
 };
 var focusField = (path, root) => {
-  const controls = focusableControls(root ?? document);
-  return path === "" ? (root !== void 0 || document.querySelectorAll("form").length <= 1) && focusFirstOf(controls) : focusFirstOf(controls.filter((el) => nameMatchesAny(el, [path])));
+  const controls = namedControls(root ?? document);
+  return path === "" ? (root !== void 0 || document.querySelectorAll("form").length <= 1) && focusFirstOf(controls.filter(isFocusCandidate)) : focusFirstOf(
+    controls.filter((el) => nameMatchesAny(el, [path])).filter(isFocusCandidate)
+  );
 };
 
-export { CheckboxField, NumberField, SelectField, TextField, checkboxProps, createForm, createFormContext, createFormHooks, emptyValueForSchema, flattenIssues, focusField, focusFirstError, getAtPath, isAsyncRequiredError, numberInputProps, numberToInputText, parseNumberText, parsePath, selectProps, setAtPath, shouldValidateOn, textInputProps, useField, useFieldArray, useForm, useFormError, useFormSelector, useFormSelectorShallow, useIsDirty, useIsSubmitting, useIsValid, useSubmitCount, validateAsync, validateSync };
+export { CheckboxField, DateField, NumberField, SelectField, TextField, checkboxProps, createForm, createFormContext, createFormHooks, dateInputProps, dateToInputText, emptyValueForSchema, flattenIssues, focusField, focusFirstError, getAtPath, isAsyncRequiredError, numberInputProps, numberToInputText, parseDateText, parseNumberText, parsePath, persistForm, selectProps, setAtPath, shouldValidateOn, textInputProps, useField, useFieldArray, useForm, useFormError, useFormSelector, useFormSelectorShallow, useIsDirty, useIsSubmitting, useIsValid, useSubmitCount, useVariantField, validateAsync, validateSync };
 //# sourceMappingURL=index.js.map
 //# sourceMappingURL=index.js.map