reactaform 1.9.21 → 1.9.40

package/README.full.md

@@ -259,14 +259,16 @@ Example — `Address` group contains `address1` and `address2`
 
 ReactaForm supports both field-level and form-level validation.
 
-- Field-level: validation for a single field; can happen in real-time (while editing) or on submission.
+- Field-level: validation for a single field; can happen while editing, on blur, or on submission.
 - Form-level: cross-field validation performed during submission.
 
 ### Field validation modes
 
 `FieldValidationMode`:
-- `realTime`: Runs validation while the user edits a field.
+- `onEdit`: Runs validation while the user edits a field.
+- `onBlur`: Runs validation when the field loses focus.
 - `onSubmission`: Runs validation only when the form is submitted.
+- `realTime`: Deprecated. Same behavior as `onEdit`.
 
 ### Validators
 

package/dist/components/fields/{ColorInput.d.ts → advanced/ColorInput.d.ts}

@@ -1,5 +1,5 @@
 import * as React from "react";
-import type { BaseInputProps, DefinitionPropertyField } from "../../core/reactaFormTypes";
+import type { BaseInputProps, DefinitionPropertyField } from "../../../core/reactaFormTypes";
 export type ColorInputProps = BaseInputProps<string, DefinitionPropertyField>;
 declare const _default: React.NamedExoticComponent<ColorInputProps>;
 export default _default;

package/dist/components/fields/{EmailInput.d.ts → advanced/EmailInput.d.ts}

@@ -1,5 +1,5 @@
 import * as React from "react";
-import type { DefinitionPropertyField, BaseInputProps } from "../../core/reactaFormTypes";
+import type { DefinitionPropertyField, BaseInputProps } from "../../../core/reactaFormTypes";
 export type EmailInputProps = BaseInputProps<string, DefinitionPropertyField>;
 export declare const EmailInput: React.FC<EmailInputProps>;
 declare const _default: React.NamedExoticComponent<EmailInputProps>;

package/dist/components/fields/{FileInput.d.ts → advanced/FileInput.d.ts}

@@ -1,5 +1,5 @@
 import * as React from "react";
-import type { BaseInputProps, DefinitionPropertyField } from "../../core/reactaFormTypes";
+import type { BaseInputProps, DefinitionPropertyField } from "../../../core/reactaFormTypes";
 export type FileInputProps = BaseInputProps<File | File[] | null, DefinitionPropertyField>;
 declare const _default: React.NamedExoticComponent<FileInputProps>;
 export default _default;

package/dist/components/fields/{PasswordInput.d.ts → advanced/PasswordInput.d.ts}

@@ -1,6 +1,6 @@
 import * as React from "react";
-import type { DefinitionPropertyField } from "../../core/reactaFormTypes";
-import type { BaseInputProps } from "../../core/reactaFormTypes";
+import type { DefinitionPropertyField } from "../../../core/reactaFormTypes";
+import type { BaseInputProps } from "../../../core/reactaFormTypes";
 type PasswordInputProps = BaseInputProps<string, DefinitionPropertyField>;
 declare const _default: React.NamedExoticComponent<PasswordInputProps>;
 export default _default;

package/dist/components/fields/{PhoneInput.d.ts → advanced/PhoneInput.d.ts}

@@ -1,6 +1,6 @@
 import * as React from "react";
-import type { DefinitionPropertyField } from "../../core/reactaFormTypes";
-import type { BaseInputProps } from "../../core/reactaFormTypes";
+import type { DefinitionPropertyField } from "../../../core/reactaFormTypes";
+import type { BaseInputProps } from "../../../core/reactaFormTypes";
 export type PhoneInputProps = BaseInputProps<string, DefinitionPropertyField>;
 export declare const PhoneInput: React.FC<PhoneInputProps>;
 declare const _default: React.NamedExoticComponent<PhoneInputProps>;

package/dist/components/fields/{RatingInput.d.ts → advanced/RatingInput.d.ts}

@@ -1,5 +1,5 @@
 import * as React from "react";
-import type { BaseInputProps, DefinitionPropertyField } from "../../core/reactaFormTypes";
+import type { BaseInputProps, DefinitionPropertyField } from "../../../core/reactaFormTypes";
 type RatingField = DefinitionPropertyField & {
     max?: number;
     icon?: string;

package/dist/components/fields/{SliderInput.d.ts → advanced/SliderInput.d.ts}

@@ -1,5 +1,5 @@
 import * as React from "react";
-import type { BaseInputProps, DefinitionPropertyField } from "../../core/reactaFormTypes";
+import type { BaseInputProps, DefinitionPropertyField } from "../../../core/reactaFormTypes";
 type SliderInputProps = BaseInputProps<string | number, DefinitionPropertyField>;
 declare const _default: React.NamedExoticComponent<SliderInputProps>;
 export default _default;

package/dist/components/fields/{UnitValueInput.d.ts → advanced/UnitValueInput.d.ts}

@@ -1,5 +1,5 @@
 import * as React from "react";
-import type { BaseInputProps, DefinitionPropertyField } from "../../core/reactaFormTypes";
+import type { BaseInputProps, DefinitionPropertyField } from "../../../core/reactaFormTypes";
 type UnitValueInputProps = BaseInputProps<[string | number, string], DefinitionPropertyField>;
 declare const _default: React.NamedExoticComponent<UnitValueInputProps>;
 export default _default;

package/dist/components/fields/{UrlInput.d.ts → advanced/UrlInput.d.ts}

@@ -1,6 +1,6 @@
 import * as React from "react";
-import type { DefinitionPropertyField } from "../../core/reactaFormTypes";
-import type { BaseInputProps } from "../../core/reactaFormTypes";
+import type { DefinitionPropertyField } from "../../../core/reactaFormTypes";
+import type { BaseInputProps } from "../../../core/reactaFormTypes";
 /**
  * UrlInput component
  */

package/dist/components/fields/{CheckboxInput.d.ts → choices/CheckboxInput.d.ts}

@@ -1,5 +1,5 @@
 import * as React from "react";
-import type { BaseInputProps, DefinitionPropertyField } from "../../core/reactaFormTypes";
+import type { BaseInputProps, DefinitionPropertyField } from "../../../core/reactaFormTypes";
 type CheckboxInputProps = BaseInputProps<boolean, DefinitionPropertyField>;
 declare const _default: React.NamedExoticComponent<CheckboxInputProps>;
 export default _default;

package/dist/components/fields/{DropdownInput.d.ts → choices/DropdownInput.d.ts}

@@ -1,5 +1,5 @@
 import * as React from "react";
-import type { BaseInputProps, DefinitionPropertyField } from "../../core/reactaFormTypes";
+import type { BaseInputProps, DefinitionPropertyField } from "../../../core/reactaFormTypes";
 type DropdownField = DefinitionPropertyField & {
     options: NonNullable<DefinitionPropertyField['options']>;
 };

package/dist/components/fields/{MultiSelection.d.ts → choices/MultiSelection.d.ts}

@@ -1,6 +1,6 @@
 import * as React from "react";
-import type { DefinitionPropertyField } from "../../core/reactaFormTypes";
-import type { BaseInputProps } from "../../core/reactaFormTypes";
+import type { DefinitionPropertyField } from "../../../core/reactaFormTypes";
+import type { BaseInputProps } from "../../../core/reactaFormTypes";
 export type OptionsField = DefinitionPropertyField & {
     options: NonNullable<DefinitionPropertyField["options"]>;
 };

package/dist/components/fields/{RadioInput.d.ts → choices/RadioInput.d.ts}

@@ -1,5 +1,5 @@
 import * as React from "react";
-import type { BaseInputProps, DefinitionPropertyField } from "../../core/reactaFormTypes";
+import type { BaseInputProps, DefinitionPropertyField } from "../../../core/reactaFormTypes";
 type RadioField = DefinitionPropertyField & {
     options: NonNullable<DefinitionPropertyField["options"]>;
 };

package/dist/components/fields/{SwitchInput.d.ts → choices/SwitchInput.d.ts}

@@ -1,5 +1,5 @@
 import * as React from "react";
-import type { BaseInputProps, DefinitionPropertyField } from "../../core/reactaFormTypes";
+import type { BaseInputProps, DefinitionPropertyField } from "../../../core/reactaFormTypes";
 type SwitchInputProps = BaseInputProps<boolean, DefinitionPropertyField>;
 declare const _default: React.NamedExoticComponent<SwitchInputProps>;
 export default _default;

package/dist/components/fields/{DateInput.d.ts → date-time/DateInput.d.ts}

@@ -1,6 +1,6 @@
 import * as React from "react";
-import type { DefinitionPropertyField } from "../../core/reactaFormTypes";
-import type { BaseInputProps } from "../../core/reactaFormTypes";
+import type { DefinitionPropertyField } from "../../../core/reactaFormTypes";
+import type { BaseInputProps } from "../../../core/reactaFormTypes";
 type DateInputProps = BaseInputProps<string, DefinitionPropertyField>;
 declare const _default: React.NamedExoticComponent<DateInputProps>;
 export default _default;

package/dist/components/fields/{TimeInput.d.ts → date-time/TimeInput.d.ts}

@@ -1,6 +1,6 @@
 import * as React from "react";
-import type { DefinitionPropertyField } from "../../core/reactaFormTypes";
-import type { BaseInputProps } from "../../core/reactaFormTypes";
+import type { DefinitionPropertyField } from "../../../core/reactaFormTypes";
+import type { BaseInputProps } from "../../../core/reactaFormTypes";
 type TimeInputProps = BaseInputProps<string, DefinitionPropertyField>;
 declare const _default: React.NamedExoticComponent<TimeInputProps>;
 export default _default;

package/dist/components/fields/{FloatArrayInput.d.ts → text-numeric/FloatArrayInput.d.ts}

@@ -1,5 +1,5 @@
 import * as React from "react";
-import type { DefinitionPropertyField, BaseInputProps } from "../../core/reactaFormTypes";
+import type { DefinitionPropertyField, BaseInputProps } from "../../../core/reactaFormTypes";
 export type FloatArrayInputProps = BaseInputProps<string | number[], DefinitionPropertyField>;
 declare const _default: React.NamedExoticComponent<FloatArrayInputProps>;
 export default _default;

package/dist/components/fields/{FloatInput.d.ts → text-numeric/FloatInput.d.ts}

@@ -1,6 +1,6 @@
 import * as React from "react";
-import type { DefinitionPropertyField } from "../../core/reactaFormTypes";
-import type { BaseInputProps } from "../../core/reactaFormTypes";
+import type { DefinitionPropertyField } from "../../../core/reactaFormTypes";
+import type { BaseInputProps } from "../../../core/reactaFormTypes";
 /**
  * FloatInput component
  */

package/dist/components/fields/{IntegerArrayInput.d.ts → text-numeric/IntegerArrayInput.d.ts}

@@ -1,6 +1,6 @@
 import * as React from "react";
-import type { DefinitionPropertyField } from "../../core/reactaFormTypes";
-import type { BaseInputProps } from "../../core/reactaFormTypes";
+import type { DefinitionPropertyField } from "../../../core/reactaFormTypes";
+import type { BaseInputProps } from "../../../core/reactaFormTypes";
 export type IntegerArrayInputProps = BaseInputProps<string | number[], DefinitionPropertyField>;
 declare const _default: React.NamedExoticComponent<IntegerArrayInputProps>;
 export default _default;

package/dist/components/fields/{IntegerInput.d.ts → text-numeric/IntegerInput.d.ts}

@@ -1,6 +1,6 @@
 import * as React from "react";
-import type { DefinitionPropertyField } from "../../core/reactaFormTypes";
-import type { BaseInputProps } from "../../core/reactaFormTypes";
+import type { DefinitionPropertyField } from "../../../core/reactaFormTypes";
+import type { BaseInputProps } from "../../../core/reactaFormTypes";
 export type IntegerInputProps = BaseInputProps<number | string, DefinitionPropertyField>;
 declare const _default: React.NamedExoticComponent<IntegerInputProps>;
 export default _default;

package/dist/components/fields/{MultilineTextInput.d.ts → text-numeric/MultilineTextInput.d.ts}

@@ -1,6 +1,6 @@
 import * as React from "react";
-import type { DefinitionPropertyField } from "../../core/reactaFormTypes";
-import type { BaseInputProps } from "../../core/reactaFormTypes";
+import type { DefinitionPropertyField } from "../../../core/reactaFormTypes";
+import type { BaseInputProps } from "../../../core/reactaFormTypes";
 type TextInputProps = BaseInputProps<string, DefinitionPropertyField>;
 declare const _default: React.NamedExoticComponent<TextInputProps>;
 export default _default;

package/dist/components/fields/{NumericStepperInput.d.ts → text-numeric/NumericStepperInput.d.ts}

@@ -1,6 +1,6 @@
 import * as React from "react";
-import type { DefinitionPropertyField } from "../../core/reactaFormTypes";
-import type { BaseInputProps } from "../../core/reactaFormTypes";
+import type { DefinitionPropertyField } from "../../../core/reactaFormTypes";
+import type { BaseInputProps } from "../../../core/reactaFormTypes";
 export type NumericStepperInputProps = BaseInputProps<string | number, DefinitionPropertyField>;
 declare const _default: React.NamedExoticComponent<NumericStepperInputProps>;
 export default _default;

package/dist/components/fields/{TextInput.d.ts → text-numeric/TextInput.d.ts}

@@ -1,6 +1,6 @@
 import * as React from "react";
-import type { DefinitionPropertyField } from "../../core/reactaFormTypes";
-import type { BaseInputProps } from "../../core/reactaFormTypes";
+import type { DefinitionPropertyField } from "../../../core/reactaFormTypes";
+import type { BaseInputProps } from "../../../core/reactaFormTypes";
 type TextInputProps = BaseInputProps<string, DefinitionPropertyField> & {
     error?: string | null;
 };

package/dist/components/fields/{Button.d.ts → ui-elements/Button.d.ts}

@@ -1,5 +1,5 @@
 import * as React from "react";
-import type { BaseInputProps, DefinitionPropertyField, FieldValueType, ErrorType } from "../../core/reactaFormTypes";
+import type { BaseInputProps, DefinitionPropertyField, FieldValueType, ErrorType } from "../../../core/reactaFormTypes";
 /**
  * Extended props for Button component
  * Unlike other fields, Button needs access to all form values

package/dist/components/fields/{ImageDisplay.d.ts → ui-elements/ImageDisplay.d.ts}

@@ -1,5 +1,5 @@
 import * as React from "react";
-import type { BaseInputProps, DefinitionPropertyField } from "../../core/reactaFormTypes";
+import type { BaseInputProps, DefinitionPropertyField } from "../../../core/reactaFormTypes";
 export type ImageProps = BaseInputProps<string, DefinitionPropertyField>;
 declare const _default: React.NamedExoticComponent<ImageProps>;
 export default _default;

package/dist/components/form/ReactaForm.d.ts

@@ -9,7 +9,7 @@ import type { ReactaFormProps } from "../../core/reactaFormTypes";
  * @param {string} [props.className] - Additional CSS class names
  * @param {string} [props.theme] - Theme name ('light' or 'dark')
  * @param {React.CSSProperties} [props.style] - Inline styles
- * @param {FieldValidationMode} [props.fieldValidationMode] - Field Validation mode ('onEdit' or 'onSubmission' or 'realTime')
+ * @param {FieldValidationMode} [props.fieldValidationMode] - Field Validation mode ('onEdit', 'onBlur', 'onSubmission', 'realTime' [deprecated])
  * @param {boolean} [props.displayInstanceName] - Whether to display the instance name
  */
 declare const ReactaForm: React.FC<ReactaFormProps>;

package/dist/core/reactaFormTypes.d.ts

@@ -10,6 +10,7 @@ export interface DefinitionPropertyField {
     displayName: string;
     type: string;
     defaultValue: FieldValueType;
+    disabled?: boolean;
     required?: boolean;
     parents?: ParentField;
     children?: Record<string, string[]>;
@@ -81,10 +82,11 @@ export interface ReactaFormProps {
 export type TranslationFunction = (text: string, ...args: unknown[]) => string;
 /** Validation mode controls where validation is performed.
  * 'onEdit' (default) - Validate fields as they are edited, showing errors immediately.
+ * 'onBlur' - Validate fields when they lose focus, reducing validation work while typing.
  * 'onSubmission' - Validate only when the form is submitted, showing errors after submission attempt.
  * 'realTime' - deprecated, use 'onEdit' instead.
  */
-export type FieldValidationMode = 'onEdit' | 'onSubmission' | 'realTime';
+export type FieldValidationMode = 'onEdit' | 'onBlur' | 'onSubmission' | 'realTime';
 export type FieldCustomValidationHandler = (fieldName: string, value: FieldValueType | unknown, t: TranslationFunction) => string | undefined;
 export type FieldTypeValidationHandler = (field: DefinitionPropertyField, input: FieldValueType, t: TranslationFunction) => string | undefined;
 export type FormValidationHandler = (valuesMap: Record<string, FieldValueType | unknown>, t: TranslationFunction) => string[] | Promise<string[] | undefined> | undefined;
@@ -93,6 +95,7 @@ export type InputOnChange<T> = (value: T | string) => void;
 export interface BaseInputProps<TValue = unknown, TField extends DefinitionPropertyField = DefinitionPropertyField> {
     field: TField;
     value: TValue;
+    disabled?: boolean;
     placeholder?: string;
     onChange?: InputOnChange<TValue>;
     onError?: (error: string | null) => void;

package/dist/hooks/useFieldValidator.d.ts

@@ -1,2 +1,3 @@
 import type { DefinitionPropertyField, FieldValueType } from '../core/reactaFormTypes';
-export declare function useFieldValidator(field: DefinitionPropertyField, externalError?: string | null): (value: FieldValueType) => string | null;
+export type ValidationTrigger = 'change' | 'blur' | 'sync';
+export declare function useFieldValidator(field: DefinitionPropertyField, externalError?: string | null): (value: FieldValueType, trigger?: ValidationTrigger) => string | null;

package/dist/hooks/useUncontrolledValidatedInput.d.ts

@@ -1,9 +1,11 @@
 import * as React from "react";
+import type { ValidationTrigger } from "./useFieldValidator";
 export type UseUncontrolledValidatedInputProps = {
     value?: string | number;
+    disabled?: boolean;
     onChange?: (value: string) => void;
     onError?: (error: string | null) => void;
-    validate: (value: string) => string | null;
+    validate: (value: string, trigger?: ValidationTrigger) => string | null;
 };
 /**
  * Handles:
@@ -11,8 +13,9 @@ export type UseUncontrolledValidatedInputProps = {
  * - Validation
  * - Error sync
  */
-export declare function useUncontrolledValidatedInput<T extends HTMLInputElement | HTMLTextAreaElement = HTMLInputElement>({ value, onChange, onError, validate, }: UseUncontrolledValidatedInputProps): {
+export declare function useUncontrolledValidatedInput<T extends HTMLInputElement | HTMLTextAreaElement = HTMLInputElement>({ value, disabled, onChange, onError, validate, }: UseUncontrolledValidatedInputProps): {
     inputRef: React.MutableRefObject<T | null>;
     error: string | null;
     handleChange: (e: React.ChangeEvent<T>) => void;
+    handleBlur: () => void;
 };