API reference

import { Form } from '@nestledjs/forms'

import { NativeForm } from '@nestledjs/forms-native'

import { RenderFormField } from '@nestledjs/forms'

import { ApolloSearchProvider } from '@nestledjs/forms/apollo'
// or '@nestledjs/forms-native/apollo' / '@nestledjs/forms-core/apollo'

import { SearchQueryProvider } from '@nestledjs/forms-core'

import { PhoneField } from '@nestledjs/forms/phone'

import { FormFieldClass } from '@nestledjs/forms'

interface BaseFieldOptions {
  // Display
  label?: string
  placeholder?: string
  helpText?: string
  hidden?: boolean

  // State
  required?: boolean
  disabled?: boolean
  readOnly?: boolean
  readOnlyStyle?: 'value' | 'disabled'
  defaultValue?: any

  // Conditional logic
  showWhen?: (formValues: Record<string, any>) => boolean
  requiredWhen?: (formValues: Record<string, any>) => boolean
  disabledWhen?: (formValues: Record<string, any>) => boolean
  validateWhen?: (formValues: Record<string, any>) => boolean

  // Validation
  validate?: (value: any) => true | string | Promise<true | string>
  schema?: ZodTypeAny
  validateWithForm?: (
    value: any,
    formValues: Record<string, any>,
  ) => true | string
  validationDependencies?: string[]
  validationGroup?: string
  errorMessages?: { required?: string; [key: string]: string | undefined }

  // Layout
  wrapperClassName?: string
  layout?: 'horizontal' | 'vertical'
  customWrapper?: (children: React.ReactNode) => React.ReactElement

  // Transform
  submitTransform?: (value: any) => unknown
}

import { useFormContext } from '@nestledjs/forms'

const {
  formValues, // Record<string, any> — current form values
  errors, // Record<string, string> — validation errors
  isSubmitting, // boolean — whether form is submitting
  setValue, // (key: string, value: any) => void
  setError, // (key: string, error: string) => void
  reset, // () => void — reset to initial values
  validateGroup, // (group: string) => Promise<boolean>
} = useFormContext()

import { useFormValue } from '@nestledjs/forms'

function Mirror() {
  const answer = useFormValue<string>('answer')
  return <p>You picked: {answer}</p>
}

import { useFormValues } from '@nestledjs/forms'

const values = useFormValues()

import { useWatch, useFormContext } from '@nestledjs/forms'

const form = useFormContext()
const answer = useWatch({ control: form.control, name: 'answer' })

import { useFormConfig } from '@nestledjs/forms'

const {
  readOnly, // boolean
  validateOnBlur, // boolean
  validateOnChange, // boolean
} = useFormConfig()

import { useFormTheme } from '@nestledjs/forms'

const theme = useFormTheme()
// theme.input, theme.label, theme.error, etc.

import { useNativeFormSubmit } from '@nestledjs/forms-native'

const submitForm = useNativeFormSubmit()
// (() => Promise<void>) | null — null outside a NativeForm

<Pressable onPress={() => submitForm?.()} />

import { useApolloSearchQuery } from '@nestledjs/forms/apollo'

import { tailwindTheme } from '@nestledjs/forms'

import { createCustomTheme } from '@nestledjs/forms'

const theme = createCustomTheme({
  input: 'custom-input-classes',
  label: 'custom-label-classes',
})
// Merges with tailwindTheme — only override what you need

import { createFinalTheme } from '@nestledjs/forms'

const theme = createFinalTheme(baseTheme, overrides)
// Merges overrides into baseTheme at runtime

import { themeReference } from '@nestledjs/forms'
// Object listing all theme property names and descriptions

import { generateThemeTemplate } from '@nestledjs/forms'
// Returns a theme object with all properties set to empty strings

import type { FormField } from '@nestledjs/forms'
// Union type of all possible field definitions

import { FormFieldType } from '@nestledjs/forms'
// Enum of all field type identifiers

import type { FormTheme } from '@nestledjs/forms'
// Interface for the complete theme object

import type { FormProps } from '@nestledjs/forms'
// Props interface for the Form component

import type { UseSearchQuery } from '@nestledjs/forms-core'

type UseSearchQuery = <TData = any>(
  document: DocumentNode | TypedDocumentNode<TData>,
  options?: { variables?: Record<string, unknown> },
) => {
  data: TData | undefined
  loading: boolean
  refetch: (variables?: Record<string, unknown>) => Promise<{ data?: TData }>
}

import {
  createFieldValidation, // Create a validation function for a field
  createFormResolver, // Create a form-level resolver
  validateGroup, // Validate a specific validation group
} from '@nestledjs/forms'

import {
  singleSelectSubmitTransform, // Option object → ID string
  multiSelectSubmitTransform, // Option objects → ID string array
  resolveSubmitTransform, // Field's explicit transform, or its per-type default
} from '@nestledjs/forms-core'

import {
  currencies, // Array of all supported currency configurations
  formatCurrency, // Format a number as currency string
  getCurrencySymbol, // Get the symbol for a currency code
} from '@nestledjs/forms'

import {
  formatDate, // Format a date value
  formatDateTime, // Format a datetime value
  formatTime, // Format a time value
} from '@nestledjs/forms'

import {
  parseLocalDate, // 'YYYY-MM-DD' string → Date in local time
  formatLocalDate, // Date → 'YYYY-MM-DD' string in local time
  parseLocalDateTime, // 'YYYY-MM-DDTHH:mm' string → Date in local time
  formatLocalDateTime, // Date → 'YYYY-MM-DDTHH:mm' string in local time
} from '@nestledjs/forms-core'