@formisch/svelte 0.5.6 → 0.7.0

package/dist/components/Form/Form.svelte

@@ -3,6 +3,7 @@
     INTERNAL,
     type Schema,
     type SubmitHandler,
+    type SubmitEventHandler,
   } from '../../core/index.svelte';
   import { handleSubmit } from '../../methods/index.svelte';
   import type { FormStore } from '../../types/index';
@@ -23,7 +24,7 @@
     /**
      * The submit handler called when the form is submitted and validation succeeds.
      */
-    onsubmit: SubmitHandler<TSchema>;
+    onsubmit: SubmitHandler<TSchema> | SubmitEventHandler<TSchema>;
     /**
      * The child elements to render within the form.
      */

package/dist/components/Form/Form.svelte.d.ts

@@ -1,4 +1,4 @@
-import { type Schema, type SubmitHandler } from '../../core/index.svelte';
+import { type Schema, type SubmitHandler, type SubmitEventHandler } from '../../core/index.svelte';
 import type { FormStore } from '../../types/index';
 import type { Snippet } from 'svelte';
 import type { HTMLFormAttributes } from 'svelte/elements';
@@ -13,7 +13,7 @@ export type FormProps<TSchema extends Schema = Schema> = Omit<HTMLFormAttributes
     /**
      * The submit handler called when the form is submitted and validation succeeds.
      */
-    onsubmit: SubmitHandler<TSchema>;
+    onsubmit: SubmitHandler<TSchema> | SubmitEventHandler<TSchema>;
     /**
      * The child elements to render within the form.
      */

package/dist/core/index.svelte.d.ts

@@ -295,7 +295,11 @@ interface BaseFormStore<TSchema extends Schema = Schema> {
 /**
 * Submit handler type.
 */
-type SubmitHandler<TSchema extends Schema> = (output: v.InferOutput<TSchema>, event: SubmitEvent) => MaybePromise<unknown>;
+type SubmitHandler<TSchema extends Schema> = (output: v.InferOutput<TSchema>) => MaybePromise<unknown>;
+/**
+* Submit event handler type.
+*/
+type SubmitEventHandler<TSchema extends Schema> = (output: v.InferOutput<TSchema>, event: SubmitEvent) => MaybePromise<unknown>;
 //#endregion
 //#region src/types/path.d.ts
 /**
@@ -547,7 +551,7 @@ declare function validateIfRequired(internalFormStore: InternalFormStore, intern
 /**
 * Framework type.
 */
-type Framework = "preact" | "qwik" | "solid" | "svelte" | "vanilla" | "vue";
+type Framework = "preact" | "qwik" | "react" | "solid" | "svelte" | "vue";
 //#endregion
 //#region src/framework/index.svelte.d.ts
 /**
@@ -578,4 +582,4 @@ declare function createSignal<T>(initialValue: T): Signal<T>;
 */
 declare function batch<T>(fn: () => T): T;
 //#endregion
-export { BaseFormStore, Batch, DeepPartial, FieldElement, FieldSchema, FormConfig, INTERNAL, InternalArrayStore, InternalBaseStore, InternalFieldStore, InternalFormStore, InternalObjectStore, InternalValueStore, IsAny, IsNever, MaybePromise, PartialValues, Path, PathKey, PathValue, RequiredPath, Schema, Signal, SubmitHandler, Untrack, ValidArrayPath, ValidPath, ValidateFormInputConfig, ValidationMode, batch, copyItemState, createFormStore, createId, createSignal, framework, getElementInput, getFieldBool, getFieldInput, getFieldStore, initializeFieldStore, resetItemState, setFieldBool, setFieldInput, setInitialFieldInput, swapItemState, untrack, validateFormInput, validateIfRequired, walkFieldStore };
+export { BaseFormStore, Batch, DeepPartial, FieldElement, FieldSchema, FormConfig, INTERNAL, InternalArrayStore, InternalBaseStore, InternalFieldStore, InternalFormStore, InternalObjectStore, InternalValueStore, IsAny, IsNever, MaybePromise, PartialValues, Path, PathKey, PathValue, RequiredPath, Schema, Signal, SubmitEventHandler, SubmitHandler, Untrack, ValidArrayPath, ValidPath, ValidateFormInputConfig, ValidationMode, batch, copyItemState, createFormStore, createId, createSignal, framework, getElementInput, getFieldBool, getFieldInput, getFieldStore, initializeFieldStore, resetItemState, setFieldBool, setFieldInput, setInitialFieldInput, swapItemState, untrack, validateFormInput, validateIfRequired, walkFieldStore };

package/dist/core/index.svelte.js

@@ -86,7 +86,7 @@ function initializeFieldStore(internalFieldStore, schema, initialInput, path, nu
 						initializeFieldStore(internalFieldStore.children[index], schema.item, initialInput[index], path);
 						path.pop();
 					}
-				} else for (let index = 0; index < schema.items; index++) {
+				} else for (let index = 0; index < schema.items.length; index++) {
 					internalFieldStore.children[index] = {};
 					path.push(index);
 					initializeFieldStore(internalFieldStore.children[index], schema.items[index], initialInput?.[index], path);
@@ -426,7 +426,7 @@ function setNestedInput(internalFieldStore, input) {
 		}
 		for (let index = 0; index < arrayInput.length; index++) setNestedInput(internalFieldStore.children[index], arrayInput[index]);
 		internalFieldStore.input.value = input == null ? input : true;
-		internalFieldStore.isDirty.value = internalFieldStore.startInput.value !== internalFieldStore.input.value || internalFieldStore.startItems.value.length !== items.length;
+		internalFieldStore.isDirty.value = internalFieldStore.startInput.value !== internalFieldStore.input.value || internalFieldStore.startItems.value.length !== internalFieldStore.items.value.length;
 	} else if (internalFieldStore.kind === "object") {
 		for (const key in internalFieldStore.children) setNestedInput(internalFieldStore.children[key], input?.[key]);
 		internalFieldStore.input.value = input == null ? input : true;

package/dist/index.d.ts

@@ -1,4 +1,4 @@
-export type { DeepPartial, FieldElement, FormConfig, PartialValues, PathValue, RequiredPath, Schema, SubmitHandler, ValidArrayPath, ValidationMode, ValidPath, } from './core/index.svelte';
+export type { DeepPartial, FieldElement, FormConfig, PartialValues, PathValue, RequiredPath, Schema, SubmitEventHandler, SubmitHandler, ValidArrayPath, ValidationMode, ValidPath, } from './core/index.svelte';
 export * from './methods/index.svelte';
 export * from './components/index';
 export * from './runes/index';

package/dist/methods/index.svelte.d.ts

@@ -1,4 +1,4 @@
-import { BaseFormStore, DeepPartial, PartialValues, PathValue, RequiredPath, Schema, SubmitHandler, ValidArrayPath, ValidPath } from "../core/index.svelte";
+import { BaseFormStore, DeepPartial, PartialValues, PathValue, RequiredPath, Schema, SubmitEventHandler, SubmitHandler, ValidArrayPath, ValidPath } from "../core/index.svelte";
 import * as v from "valibot";
 
 //#region src/focus/focus.d.ts
@@ -116,6 +116,17 @@ declare function getInput<TSchema extends Schema, TFieldPath extends RequiredPat
 //#endregion
 //#region src/handleSubmit/handleSubmit.d.ts
 /**
+* Creates a submit event handler for the form that validates the form input,
+* and calls the provided handler if validation succeeds. This is designed to
+* be used with the form's onsubmit event.
+*
+* @param form The form store to handle submission for.
+* @param handler The submit handler function called with validated output if validation succeeds.
+*
+* @returns A submit event handler function to attach to the form element.
+*/
+declare function handleSubmit<TSchema extends Schema>(form: BaseFormStore<TSchema>, handler: SubmitHandler<TSchema>): () => Promise<void>;
+/**
 * Creates a submit event handler for the form that prevents default browser
 * submission, validates the form input, and calls the provided handler if
 * validation succeeds. This is designed to be used with the form's onsubmit event.
@@ -125,7 +136,7 @@ declare function getInput<TSchema extends Schema, TFieldPath extends RequiredPat
 *
 * @returns A submit event handler function to attach to the form element.
 */
-declare function handleSubmit<TSchema extends Schema>(form: BaseFormStore<TSchema>, handler: SubmitHandler<TSchema>): (event: SubmitEvent) => Promise<void>;
+declare function handleSubmit<TSchema extends Schema>(form: BaseFormStore<TSchema>, handler: SubmitEventHandler<TSchema>): (event: SubmitEvent) => Promise<void>;
 //#endregion
 //#region src/insert/insert.d.ts
 /**

package/dist/methods/index.svelte.js

@@ -54,7 +54,7 @@ function getInput(form, config) {
 /* @__NO_SIDE_EFFECTS__ */
 function handleSubmit(form, handler) {
 	return async (event) => {
-		event.preventDefault();
+		event?.preventDefault();
 		const internalFormStore = form[INTERNAL];
 		internalFormStore.isSubmitted.value = true;
 		internalFormStore.isSubmitting.value = true;

package/dist/runes/useField/useField.svelte.js

@@ -29,6 +29,10 @@ export function useField(form, config) {
         get isValid() {
             return isValid;
         },
+        onInput(value) {
+            setFieldInput(internalFormStore, path, value);
+            validateIfRequired(internalFormStore, internalFieldStore, 'input');
+        },
         props: {
             get name() {
                 return internalFieldStore.name;

package/dist/types/field.d.ts

@@ -62,6 +62,10 @@ export interface FieldStore<TSchema extends Schema = Schema, TFieldPath extends
      * Whether the field is valid according to the schema.
      */
     readonly isValid: boolean;
+    /**
+     * Sets the field input value programmatically.
+     */
+    readonly onInput: (value: PartialValues<PathValue<v.InferInput<TSchema>, TFieldPath>>) => void;
     /**
      * The props for the field element.
      */

package/dist/utils/unwrap/unwrap.d.ts

@@ -1,2 +1,9 @@
 import type { MaybeGetter } from '../../types/index';
+/**
+ * Unwraps a value that may be a getter function.
+ *
+ * @param value The value or getter function.
+ *
+ * @returns The unwrapped value.
+ */
 export declare function unwrap<T>(value: MaybeGetter<T>): T;

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@formisch/svelte",
   "description": "The modular and type-safe form library for Svelte",
-  "version": "0.5.6",
+  "version": "0.7.0",
   "license": "MIT",
   "author": "Fabian Hiller",
   "homepage": "https://formisch.dev",
@@ -37,7 +37,6 @@
   },
   "devDependencies": {
     "@eslint/compat": "^1.3.2",
-    "@eslint/js": "^9.35.0",
     "@sveltejs/adapter-auto": "^6.1.0",
     "@sveltejs/kit": "^2.37.1",
     "@sveltejs/package": "^2.5.0",
@@ -49,11 +48,11 @@
     "svelte": "^5.38.8",
     "svelte-check": "^4.3.1",
     "typescript": "^5.9.2",
-    "typescript-eslint": "^8.43.0",
     "valibot": "^1.2.0",
     "vite": "^7.1.5",
-    "@formisch/core": "0.4.5",
-    "@formisch/methods": "0.5.2"
+    "@formisch/core": "0.6.0",
+    "@formisch/eslint-config": "0.1.0",
+    "@formisch/methods": "0.7.0"
   },
   "peerDependencies": {
     "svelte": "^5.29.0",