@modular-forms/preact
Advanced tools
Comparing version
import { jsx as _jsx } from "preact/jsx-runtime"; | ||
import { batch } from '@preact/signals'; | ||
import { getValues, validate } from '../methods'; | ||
import { FormError } from '../exceptions'; | ||
import { getValues, setError, setResponse, validate } from '../methods'; | ||
/** | ||
@@ -8,3 +9,3 @@ * HTML form element that simplifies form submission and disables the browser's | ||
*/ | ||
export function Form({ of: form, onSubmit, keepResponse, shouldActive, shouldTouched, shouldDirty, shouldFocus, ...props }) { | ||
export function Form({ of: form, onSubmit, responseDuration: duration, keepResponse, shouldActive, shouldTouched, shouldDirty, shouldFocus, ...props }) { | ||
return (_jsx("form", { ...props, noValidate: true, ref: (element) => (form.element.value = element), onSubmit: async (event) => { | ||
@@ -25,2 +26,3 @@ // Prevent default behavior of browser | ||
const options = { | ||
duration, | ||
shouldActive, | ||
@@ -36,9 +38,23 @@ shouldTouched, | ||
} | ||
// If an error occurred, set error response | ||
// If an error occurred, set error to fields and response | ||
} | ||
catch (error) { | ||
form.response.value = { | ||
status: 'error', | ||
message: error?.message || 'An unknown error has occurred.', | ||
}; | ||
batch(() => { | ||
if (error instanceof FormError) { | ||
Object.entries(error.errors).forEach(([name, error]) => { | ||
if (error) { | ||
setError(form, name, error, { | ||
...options, | ||
shouldFocus: false, | ||
}); | ||
} | ||
}); | ||
} | ||
if (!(error instanceof FormError) || error.message) { | ||
setResponse(form, { | ||
status: 'error', | ||
message: error?.message || 'An unknown error has occurred.', | ||
}, options); | ||
} | ||
}); | ||
// Finally set submitting back to "false" | ||
@@ -45,0 +61,0 @@ } |
export * from './adapters'; | ||
export * from './components'; | ||
export * from './exceptions'; | ||
export { useForm, useFormStore } from './hooks'; | ||
@@ -4,0 +5,0 @@ export * from './methods'; |
import type { ComponentChildren } from 'preact'; | ||
import type { JSX } from 'preact/jsx-runtime'; | ||
import type { FieldValues, FormStore, MaybePromise, ResponseData } from '../types'; | ||
import type { FieldValues, FormStore, Maybe, MaybePromise, ResponseData } from '../types'; | ||
/** | ||
@@ -23,7 +23,8 @@ * Value type of the submit event object. | ||
onSubmit: SubmitHandler<TFieldValues>; | ||
keepResponse?: boolean; | ||
shouldActive?: boolean; | ||
shouldTouched?: boolean; | ||
shouldDirty?: boolean; | ||
shouldFocus?: boolean; | ||
responseDuration?: Maybe<number>; | ||
keepResponse?: Maybe<boolean>; | ||
shouldActive?: Maybe<boolean>; | ||
shouldTouched?: Maybe<boolean>; | ||
shouldDirty?: Maybe<boolean>; | ||
shouldFocus?: Maybe<boolean>; | ||
children: ComponentChildren; | ||
@@ -35,2 +36,2 @@ }; | ||
*/ | ||
export declare function Form<TFieldValues extends FieldValues, TResponseData extends ResponseData>({ of: form, onSubmit, keepResponse, shouldActive, shouldTouched, shouldDirty, shouldFocus, ...props }: FormProps<TFieldValues, TResponseData>): JSX.Element; | ||
export declare function Form<TFieldValues extends FieldValues, TResponseData extends ResponseData>({ of: form, onSubmit, responseDuration: duration, keepResponse, shouldActive, shouldTouched, shouldDirty, shouldFocus, ...props }: FormProps<TFieldValues, TResponseData>): JSX.Element; |
export * from './adapters'; | ||
export * from './components'; | ||
export * from './exceptions'; | ||
export { useForm, useFormStore } from './hooks'; | ||
@@ -4,0 +5,0 @@ export * from './methods'; |
{ | ||
"name": "@modular-forms/preact", | ||
"description": "The modular and type-safe form library for Preact", | ||
"version": "0.4.0", | ||
"version": "0.5.0", | ||
"license": "MIT", | ||
@@ -6,0 +6,0 @@ "author": "Fabian Hiller", |
Sorry, the diff of this file is not supported yet
Sorry, the diff of this file is not supported yet
Sorry, the diff of this file is not supported yet
280159
1.98%186
2.2%7358
2.04%