# Champ personnalisé renderers

<PageBadges />

renderers personnalisé change de présentation sans déplacer les calculs, la visibilité, les exigences ou
validation hors `form0-core`.

## Dérogations visées

Préférez `FieldRegistryProvider` lorsqu'une application, une route, un test ou une histoire de Storybook a besoin d'une
isolé renderer ensemble:

```jsx
import { FieldRegistryProvider, FormRenderer } from "form0-react"
import { DateField } from "./date-field.jsx"

export function AppForm({ schema }) {
  return (
    <FieldRegistryProvider renderers={{ DateField }}>
      <FormRenderer schema={schema} />
    </FieldRegistryProvider>
  )
}
```

Un renderer reçoit le contrat de champ utilisé par les valeurs par défaut:

```jsx
function DateField({ field, value, onChange, readOnly, inputProps, className }) {
  return (
    <input
      {...inputProps}
      className={className}
      type="date"
      value={value ?? ""}
      disabled={readOnly}
      onChange={(event) => onChange(event.target.value)}
    />
  )
}
```

Préservez les propriétés d'accessibilité fournies dans `inputProps`.

## Instances de registre et remplacements globaux

Utilisez `createFieldRegistry({ includeDefaults, renderers })` pour une instance de Registre explicite.
`registerFieldComponent`, `unregisterFieldComponent`, et `resetFieldComponents`
helpers muter le registre partagé par défaut et sont mieux réservés pour l'application bootstrap ou
tests.

Seuls les types de champs déclarés par `form0-core` peuvent être enregistrés.
défini dans Core; un React renderer seul ne peut pas prolonger le contrat schema.