UNPKG

jarb-final-form

Version:
52 lines (50 loc) 1.7 kB
import React, { Component } from 'react'; import { FieldValidator } from 'final-form'; import { FieldProps } from 'react-final-form'; export interface JarbProps { validator: string; label: string; } export interface JarbFieldProps<FieldValue, T extends HTMLElement> extends FieldProps<FieldValue, T> { jarb: JarbProps; validators?: FieldValidator<FieldValue>[]; } /** * JarbField wrappes final-form's Field, and adds the auto validation * from the constraints. In fact it is a very thin wrapper around * Field. * * It only demands one extra property called 'jarb' which is used * to to configure the Field. The 'jarb' object needs two keys: * the 'validator' and the 'label'. * * The 'validator' follows the following format: {Entity}.{Property}. * For example if the validator property is 'SuperHero.name' this means that * the Field will apply the constraints for the 'name' property of * the 'SuperHero' entity. * * The 'label' is used to inform you which field was wrong, when errors occur. * You will receive the 'label' when an error occurs to create a nice * error message. * * It is also possible to add custom field validators. Since * * @example * ```JavaScript * <JarbField * name="Name" * jarb={{ validator: 'SuperHero.name', label: "Name" }} * component="input" * type="text" * /> * ``` * * @export * @param {Props.jarb} object Object containing the 'label' and 'validator'. * @returns */ export declare class JarbField<FieldValue, T extends HTMLElement> extends Component<JarbFieldProps<FieldValue, T>> { private enhancedValidate; getEnhancedValidate(): FieldValidator<FieldValue> | null; render(): React.ReactNode; }