mobx-formly 0.0.1

package/README.md

@@ -0,0 +1,37 @@
+# mobx-formly
+
+[![NPM version](https://img.shields.io/npm/v/mobx-formly.svg)](https://npmjs.org/package/mobx-formly)
+[![Build status](https://github.com/js2me/mobx-formly/actions/workflows/main.yml/badge.svg)](https://github.com/js2me/mobx-formly/actions/workflows/main.yml)
+[![Documentation](https://img.shields.io/badge/docs-online-blue)](https://js2me.github.io/mobx-formly/)
+
+Observable, framework-agnostic forms for MobX 6. No React dependency and no hooks required. Supports Zod and Valibot schemas, async validation, nested paths, and granular field state.
+
+## Documentation
+
+[Read the documentation →](https://js2me.github.io/mobx-formly/)
+
+## Installation
+
+Install mobx-formly together with MobX. Zod and Valibot are optional peer dependencies
+for schema-based validation.
+
+## How it works
+
+Create a form controller with initial values and, optionally, a Zod or Valibot schema.
+Register fields with your UI layer, observe their values and state, then submit through
+the controller. The controller exposes field-level errors and status as well as aggregate
+form state.
+
+## Features
+
+- Stable, granular `fieldState[name]` branches.
+- Zod validation, including async refinements.
+- Valibot schema support alongside Zod.
+- Field rules such as `required`, `minLength`, `pattern`, and async `validate`.
+- Nested object and array paths such as `profile.email` and `items.0.name`.
+- Direct observable mutations through `mutate()` with dirty-path detection.
+- Framework agnostic: usable with React, Vue, Solid, or plain TypeScript.
+
+## License
+
+[MIT](https://github.com/js2me/mobx-formly/blob/main/LICENSE)

package/dist/create-form.d.ts

@@ -0,0 +1,11 @@
+import { Form } from './form.js';
+import type { FieldValues, FormOptions, FormSchema, SchemaOutput } from './types.js';
+export type InferredFormValues<S> = Extract<SchemaOutput<S>, FieldValues>;
+/**
+ * Creates a form with values inferred from its schema.
+ *
+ * [**Documentation**](https://js2me.github.io/mobx-formly/guide/getting-started.html)
+ */
+export declare const createForm: <S extends FormSchema<any>>(options: FormOptions<InferredFormValues<S>> & {
+    schema: S;
+}) => Form<InferredFormValues<S>>;

package/dist/create-form.js

@@ -0,0 +1,7 @@
+import { Form } from './form.js';
+/**
+ * Creates a form with values inferred from its schema.
+ *
+ * [**Documentation**](https://js2me.github.io/mobx-formly/guide/getting-started.html)
+ */
+export const createForm = (options) => new Form(options);

package/dist/form.d.ts

@@ -0,0 +1,193 @@
+import { type Ref } from 'yummies/mobx';
+import type { FieldError, FieldPath, FieldPathValue, FieldState, FieldValues, FormOptions, RegisterOptions, RegisterReturn, ResetOptions, SetValueConfig, SubmitHandlers } from './types.js';
+export declare class Form<T extends FieldValues = FieldValues> {
+    /**
+     * Current form values.
+     *
+     * [**Documentation**](https://js2me.github.io/mobx-formly/api/form.html#values)
+     */
+    values: T;
+    /**
+     * Errors keyed by field path.
+     *
+     * [**Documentation**](https://js2me.github.io/mobx-formly/api/form.html#errors)
+     */
+    errors: Record<string, FieldError | undefined>;
+    /**
+     * Field paths whose values differ from their defaults.
+     *
+     * [**Documentation**](https://js2me.github.io/mobx-formly/api/form.html#dirtyfields)
+     */
+    dirtyFields: Record<string, true | undefined>;
+    /**
+     * Field paths that have been touched.
+     *
+     * [**Documentation**](https://js2me.github.io/mobx-formly/api/form.html#touchedfields)
+     */
+    touchedFields: Record<string, true | undefined>;
+    /**
+     * Field paths that are currently being validated.
+     *
+     * [**Documentation**](https://js2me.github.io/mobx-formly/api/form.html#validatingfields)
+     */
+    validatingFields: Record<string, true | undefined>;
+    /**
+     * Observable state for each registered field.
+     *
+     * [**Documentation**](https://js2me.github.io/mobx-formly/api/form.html#fieldstate)
+     */
+    fieldState: Record<string, FieldState | undefined>;
+    /**
+     * Whether a submission is currently running.
+     *
+     * [**Documentation**](https://js2me.github.io/mobx-formly/api/form.html#issubmitting)
+     */
+    isSubmitting: boolean;
+    /**
+     * Whether the form has been submitted at least once.
+     *
+     * [**Documentation**](https://js2me.github.io/mobx-formly/api/form.html#issubmitted)
+     */
+    isSubmitted: boolean;
+    /**
+     * Whether the latest submission succeeded.
+     *
+     * [**Documentation**](https://js2me.github.io/mobx-formly/api/form.html#issubmitsuccessful)
+     */
+    isSubmitSuccessful: boolean;
+    /**
+     * Number of submission attempts.
+     *
+     * [**Documentation**](https://js2me.github.io/mobx-formly/api/form.html#submitcount)
+     */
+    submitCount: number;
+    /**
+     * Refs registered for fields.
+     *
+     * [**Documentation**](https://js2me.github.io/mobx-formly/api/form.html#refs)
+     */
+    readonly refs: Map<string, Ref<HTMLElement | null, import("yummies/types").AnyObject>>;
+    private readonly defaultValues;
+    private readonly options;
+    private readonly fieldOptions;
+    private valueObservers?;
+    private observerTimer?;
+    private readonly changedPaths;
+    private isMutating;
+    private observerTreeChanged;
+    private activeSubmissions;
+    private resetVersion;
+    private validationVersion;
+    private readonly fieldValidationVersions;
+    /** Creates a form with optional initial values, schema, and validation settings.
+     *
+     * [**Documentation**](https://js2me.github.io/mobx-formly/api/form.html#constructor-options)
+     */
+    constructor(options?: FormOptions<T>);
+    /**
+     * Whether registered event handlers ignore changes and blur events.
+     *
+     * [**Documentation**](https://js2me.github.io/mobx-formly/api/form.html#disabled)
+     */
+    get disabled(): boolean;
+    /**
+     * Whether any field is dirty.
+     *
+     * [**Documentation**](https://js2me.github.io/mobx-formly/api/form.html#isdirty)
+     */
+    get isDirty(): boolean;
+    /**
+     * Whether the form has no errors.
+     *
+     * [**Documentation**](https://js2me.github.io/mobx-formly/api/form.html#isvalid)
+     */
+    get isValid(): boolean;
+    /**
+     * Registers a field and returns its ref and event handlers.
+     *
+     * [**Documentation**](https://js2me.github.io/mobx-formly/api/form.html#registername-options)
+     */
+    register(name: FieldPath<T>, options?: RegisterOptions<T>): RegisterReturn;
+    /**
+     * Removes a field, its value, and its associated state.
+     *
+     * [**Documentation**](https://js2me.github.io/mobx-formly/api/form.html#unregistername)
+     */
+    unregister(name: FieldPath<T>): void;
+    /**
+     * Updates a field value and optionally changes its state or validates it.
+     *
+     * [**Documentation**](https://js2me.github.io/mobx-formly/api/form.html#setvaluename-value-config)
+     */
+    setValue<P extends FieldPath<T>>(name: P, value: FieldPathValue<T, P>, config?: SetValueConfig): void;
+    /**
+     * Groups direct value changes and processes their changed paths together.
+     *
+     * [**Documentation**](https://js2me.github.io/mobx-formly/api/form.html#mutatemutator-config)
+     */
+    mutate(mutator: () => void, config?: SetValueConfig): void;
+    private applyValueChange;
+    private ensureValueObservers;
+    private scheduleObserverCleanup;
+    private disposeValueObservers;
+    private observeValueTree;
+    /**
+     * Sets an error for a field.
+     *
+     * [**Documentation**](https://js2me.github.io/mobx-formly/api/form.html#seterrorname-error)
+     */
+    setError(name: FieldPath<T>, error: FieldError): void;
+    /**
+     * Clears one, several, or all field errors.
+     *
+     * [**Documentation**](https://js2me.github.io/mobx-formly/api/form.html#clearerrorsname)
+     */
+    clearErrors(name?: FieldPath<T> | FieldPath<T>[]): void;
+    /**
+     * Validates one field, several fields, or the complete form.
+     *
+     * [**Documentation**](https://js2me.github.io/mobx-formly/api/form.html#triggername)
+     */
+    trigger(name?: FieldPath<T> | FieldPath<T>[]): Promise<boolean>;
+    /**
+     * Creates an asynchronous submit handler with validation and result callbacks.
+     *
+     * [**Documentation**](https://js2me.github.io/mobx-formly/api/form.html#handlesubmithandlers)
+     */
+    handleSubmit({ onValid, onInvalid }: SubmitHandlers<T>): () => Promise<void>;
+    /**
+     * Resets values and selected form state.
+     *
+     * [**Documentation**](https://js2me.github.io/mobx-formly/api/form.html#resetvalues-options)
+     */
+    reset(values?: Partial<T>, options?: ResetOptions): void;
+    /**
+     * Resets one field to its current default value and clears its state.
+     *
+     * [**Documentation**](https://js2me.github.io/mobx-formly/api/form.html#resetfieldname)
+     */
+    resetField(name: FieldPath<T>): void;
+    /**
+     * Focuses a registered field when its ref points to a focusable element.
+     *
+     * [**Documentation**](https://js2me.github.io/mobx-formly/api/form.html#setfocusname)
+     */
+    setFocus(name: FieldPath<T>): void;
+    /**
+     * Returns a plain copy of the current values.
+     *
+     * [**Documentation**](https://js2me.github.io/mobx-formly/api/form.html#snapshot)
+     */
+    get snapshot(): T;
+    private markTouched;
+    private updateDirty;
+    private shouldValidateOnChange;
+    private isValidationCurrent;
+    private transformValue;
+    private validateSchema;
+    private normalizeSchemaErrors;
+    private validateRules;
+    private ensureFieldState;
+    private applyFieldState;
+    private applyError;
+}