File Manager

📁 Media Files

📁 .. (Parent Directory) 📋 ConvertFieldAPIRulesToJoi.ts 📋 PrepareFormData.ts 📋 amountFormatter.ts 📋 buildRegisterValidationOptions.ts ⚡ conditionOperatorFunctions.js 📋 convertValuesToFormData.ts ⚡ createValidationObjectFromFields.js 📋 generateRequestErrors.ts ⚡ getCurrentFormUrlData.js 📋 getDefaultValuesFromSections.ts 📋 getDonationFormNodeSettings.ts 📋 getErrorByFieldName.ts 📋 getWindowData.ts 📋 groups.ts 📋 handleFormRedirect.ts 📋 handleFormSubmitRequest.ts 📋 handleValidationRequest.ts 📋 isRouteInlineRedirect.ts 📋 memoNode.ts 📋 mountWindowData.ts 📋 postData.ts 📋 postFormData.ts 📋 registerFieldAndBuildProps.tsx 📋 setDesignSettings.ts 📋 useDonationFormPubSub.ts

⬆️ Upload Files

📁 Create Folder

📄 Create File

💻 Terminal

📦 Extract Archive

📋 Edit: registerFieldAndBuildProps.tsx

TSX

Size: 1.28 KB | Modified: 2025-05-21 18:18:30

import {Field} from '@givewp/forms/types';
import {FieldProps} from '@givewp/forms/propTypes';
import {UseFormReturn} from 'react-hook-form';
import buildRegisterValidationOptions from './buildRegisterValidationOptions';
import getErrorByFieldName from './getErrorByFieldName';

const formTemplates = window.givewp.form.templates;
const LabelTemplate = formTemplates.layouts.fieldLabel;
const ErrorMessageTemplate = formTemplates.layouts.fieldError;

/**
 * @since 4.3.0 include aria-required attribute in all required fields.
 */
export default function registerFieldAndBuildProps(
    field: Field,
    register: UseFormReturn['register'],
    errors
): FieldProps {
    const fieldError = getErrorByFieldName(errors, field.name);
    const validationOptions = buildRegisterValidationOptions(field.validationRules);

const baseInputProps = register(field.name, validationOptions);

const inputProps = {
        ...baseInputProps,
        'aria-required': !!field.validationRules?.required ? 'true' : undefined,
    };

return {
        ...field,
        inputProps: inputProps,
        fieldError,
        Label: () => <LabelTemplate label={field.label} required={field.validationRules?.required} />,
        ErrorMessage: () => <ErrorMessageTemplate error={fieldError} name={field.name} />,
    };
}

Supports: PHP, ASPX, HTML, JavaScript, CSS and other text-based files

📥 Download

File manager