# Référence des paquets de framework

Chaque fonction, classe et type publics, tels que publiés à la version `0.1.0-alpha.7`. La page [SDK JavaScript](/fr/guides/javascript-sdk/) présente l’aperçu et les exemples.

Chaque paquet est une mince couche au-dessus de [`@formerie/client`](/fr/guides/sdk-reference/), alors ses types, comme `FormerieTarget`, sont dans la référence du client.

## React

`@formerie/react`

### React: useFormerieClient

Un `FormerieRuntimeClient` pour un composant.

```ts
function useFormerieClient(config?: FormerieClientConfig): FormerieClient;
```

### React: useFormerieSubmit

Soumet à une cible, suit l’état et le résultat, et peut aussi vérifier des réponses et lire le schéma.

```ts
function useFormerieSubmit(target: FormerieTarget, config?: FormerieClientConfig): UseFormerieSubmitResult;
```

### React: FormerieSubmitState

```ts
interface FormerieSubmitState {
    status: FormerieSubmitStatus;
    result: SubmitResponse | null;
}
```

### React: FormerieSubmitStatus

```ts
type FormerieSubmitStatus = "idle" | "submitting" | "success" | "error";
```

### React: UseFormerieSubmitResult

```ts
interface UseFormerieSubmitResult {
    client: FormerieClient;
    state: FormerieSubmitState;
    isSubmitting: boolean;
    submit: (payload: SubmitPayload, options?: SubmitRequestOptions) => Promise<SubmitResponse>;
    validate: (payload: ValidatePayload, options?: SubmitRequestOptions) => Promise<ValidateResponse>;
    schema: (options?: SubmitRequestOptions) => Promise<PublicFormSchemaResult>;
    reset: () => void;
}
```

## Vue

`@formerie/vue`

### Vue: useFormerieClient

Un `FormerieRuntimeClient` sous forme de référence calculée.

```ts
function useFormerieClient(config?: MaybeRef<FormerieClientConfig>): ComputedRef<FormerieClient>;
```

### Vue: useFormerieSubmit

Soumet à une cible et suit l’état et le résultat dans des références. Peut aussi vérifier des réponses et lire le schéma.

```ts
function useFormerieSubmit(target: MaybeRef<FormerieTarget>, config?: MaybeRef<FormerieClientConfig>): UseFormerieSubmitResult;
```

### Vue: FormerieSubmitStatus

```ts
type FormerieSubmitStatus = "idle" | "submitting" | "success" | "error";
```

### Vue: UseFormerieSubmitResult

```ts
interface UseFormerieSubmitResult {
    client: ComputedRef<FormerieClient>;
    status: Ref<FormerieSubmitStatus>;
    result: ShallowRef<SubmitResponse | null>;
    isSubmitting: ComputedRef<boolean>;
    submit: (payload: SubmitPayload, options?: SubmitRequestOptions) => Promise<SubmitResponse>;
    validate: (payload: ValidatePayload, options?: SubmitRequestOptions) => Promise<ValidateResponse>;
    schema: (options?: SubmitRequestOptions) => Promise<PublicFormSchemaResult>;
    reset: () => void;
}
```

## Svelte

`@formerie/svelte`

### Svelte: createFormerieClient

Un `FormerieRuntimeClient`.

```ts
function createFormerieClient(config?: FormerieClientConfig): FormerieClient;
```

### Svelte: createFormerieRenderModel

Un magasin des champs et des étapes à afficher, qui suit le schéma et les réponses.

```ts
function createFormerieRenderModel(schema: FormerieReadableInput<PublicSchemaInput>, values?: FormerieReadableInput<Record<string, unknown>>, options?: FormerieReadableInput<DescribeFormerieRenderModelOptions>): Readable<FormerieRenderModel>;
```

### Svelte: createFormerieSubmit

Soumet à une cible et suit l’état et le résultat dans des magasins. Peut aussi vérifier des réponses et lire le schéma.

```ts
function createFormerieSubmit(target: FormerieTarget, config?: FormerieClientConfig): FormerieSubmitStore;
```

### Svelte: FormerieReadableInput

```ts
type FormerieReadableInput<T> = T | Readable<T>;
```

### Svelte: FormerieSubmitStatus

```ts
type FormerieSubmitStatus = "idle" | "submitting" | "success" | "error";
```

### Svelte: FormerieSubmitStore

```ts
interface FormerieSubmitStore {
    client: FormerieClient;
    status: Writable<FormerieSubmitStatus>;
    result: Writable<SubmitResponse | null>;
    isSubmitting: Readable<boolean>;
    submit: (payload: SubmitPayload, options?: SubmitRequestOptions) => Promise<SubmitResponse>;
    validate: (payload: ValidatePayload, options?: SubmitRequestOptions) => Promise<ValidateResponse>;
    schema: (options?: SubmitRequestOptions) => Promise<PublicFormSchemaResult>;
    reset: () => void;
}
```

## Solid

`@formerie/solid`

### Solid: createFormerieClient

Un `FormerieRuntimeClient` sous forme d’accesseur.

```ts
function createFormerieClient(config?: MaybeAccessor<FormerieClientConfig>): Accessor<FormerieClient>;
```

### Solid: createFormerieSubmit

Soumet à une cible et suit l’état et le résultat dans des accesseurs. Peut aussi vérifier des réponses et lire le schéma.

```ts
function createFormerieSubmit(target: MaybeAccessor<FormerieTarget>, config?: MaybeAccessor<FormerieClientConfig>): CreateFormerieSubmitResult;
```

### Solid: CreateFormerieSubmitResult

```ts
interface CreateFormerieSubmitResult {
    client: Accessor<FormerieClient>;
    status: Accessor<FormerieSubmitStatus>;
    result: Accessor<SubmitResponse | null>;
    isSubmitting: Accessor<boolean>;
    submit: (payload: SubmitPayload, options?: SubmitRequestOptions) => Promise<SubmitResponse>;
    validate: (payload: ValidatePayload, options?: SubmitRequestOptions) => Promise<ValidateResponse>;
    schema: (options?: SubmitRequestOptions) => Promise<PublicFormSchemaResult>;
    reset: () => void;
}
```

### Solid: FormerieSubmitStatus

```ts
type FormerieSubmitStatus = "idle" | "submitting" | "success" | "error";
```

### Solid: MaybeAccessor

```ts
type MaybeAccessor<T> = T | Accessor<T>;
```

## Angular

`@formerie/angular`

### Angular: FORMERIE_CLIENT_CONFIG

Le jeton d’injection des réglages du client. Facultatif.

```ts
const FORMERIE_CLIENT_CONFIG: InjectionToken<FormerieClientConfig>;
```

### Angular: FormerieService

Un service injectable qui lit le schéma, vérifie les réponses et soumet, pour une cible. `getClient()` renvoie un `FormerieRuntimeClient`.

```ts
class FormerieService {
    getClient(): FormerieClient;
    submit(target: FormerieTarget, payload: SubmitPayload, options?: SubmitRequestOptions): Promise<SubmitResponse>;
    validate(target: FormerieTarget, payload: ValidatePayload, options?: SubmitRequestOptions): Promise<ValidateResponse>;
    schema(target: FormerieTarget, options?: SubmitRequestOptions): Promise<PublicFormSchemaResult>;
}
```

## Astro

`@formerie/astro`

### Astro: createFormerieClient

Un `FormerieRuntimeClient`.

```ts
function createFormerieClient(config?: FormerieClientConfig): FormerieClient;
```

### Astro: createFormerieFormAttributes

Les attributs `data-formerie-*` d’un `<form>`, avec les adresses de sa cible.

```ts
function createFormerieFormAttributes(target: FormerieTarget, options?: FormerieAstroFormAttributesOptions): Record<string, string>;
```

### Astro: FormerieAstroFormAttributesOptions

```ts
interface FormerieAstroFormAttributesOptions {
    endpoint?: string;
    includeSchemaUrl?: boolean;
    includeValidateUrl?: boolean;
}
```

## Next

`@formerie/next`

### Next: createFormerieNextAction

Une action serveur qui soumet `FormData` à une cible. Consultez [l’approche serveur](/fr/guides/framework-entry-points/#les-limites-avec-un-serveur) pour ses limites.

```ts
function createFormerieNextAction(target: FormerieTarget, options?: CreateFormerieNextActionOptions): (formData: FormData) => Promise<SubmitResponse>;
```

### Next: createFormerieNextServerHelpers

Le client, les appels de schéma et de validation, et une action de soumission, pour une cible.

```ts
function createFormerieNextServerHelpers(target: FormerieTarget, options?: CreateFormerieNextActionOptions): FormerieNextServerHelpers;
```

### Next: CreateFormerieNextActionOptions

```ts
interface CreateFormerieNextActionOptions {
    client?: FormerieClient;
    clientConfig?: FormerieClientConfig;
    payloadOptions?: CreateFormerieSubmitPayloadOptions;
    submitOptions?: SubmitRequestOptions;
}
```

### Next: FormerieNextServerHelpers

```ts
interface FormerieNextServerHelpers {
    client: FormerieClient;
    schema: (options?: SubmitRequestOptions) => Promise<PublicFormSchemaResult>;
    submitAction: (formData: FormData) => Promise<SubmitResponse>;
    validate: (payload: ValidatePayload, options?: SubmitRequestOptions) => Promise<ValidateResponse>;
}
```

### Next: FormerieSubmitState

Le même que dans `@formerie/react`, réexporté.

### Next: FormerieSubmitStatus

Le même que dans `@formerie/react`, réexporté.

### Next: useFormerieClient

Le même que dans `@formerie/react`, réexporté.

### Next: useFormerieSubmit

Le même que dans `@formerie/react`, réexporté.

### Next: UseFormerieSubmitResult

Le même que dans `@formerie/react`, réexporté.

## Nuxt

`@formerie/nuxt`

### Nuxt: createFormerieNuxtClient

Un `FormerieRuntimeClient`, avec son adresse tirée de la configuration d’exécution de Nuxt.

```ts
function createFormerieNuxtClient(runtimeConfig?: FormerieNuxtRuntimeConfig, config?: FormerieClientConfig): FormerieClient;
```

### Nuxt: createFormerieNuxtSubmitHandler

Un gestionnaire serveur qui soumet à une cible les données de formulaire que renvoie votre `readFormData`.

```ts
function createFormerieNuxtSubmitHandler<Event = unknown>(target: FormerieTarget, options: CreateFormerieNuxtSubmitHandlerOptions<Event>): (event: Event) => Promise<SubmitResponse>;
```

### Nuxt: CreateFormerieNuxtSubmitHandlerOptions

```ts
interface CreateFormerieNuxtSubmitHandlerOptions<Event = unknown> {
    client?: FormerieClient;
    clientConfig?: FormerieClientConfig;
    payloadOptions?: CreateFormerieSubmitPayloadOptions;
    readFormData: (event: Event) => Promise<FormData> | FormData;
    submitOptions?: SubmitRequestOptions;
}
```

### Nuxt: FormerieNuxtRuntimeConfig

```ts
interface FormerieNuxtRuntimeConfig {
    formerie?: {
        endpoint?: string;
    };
    public?: {
        formerie?: {
            endpoint?: string;
        };
    };
}
```

### Nuxt: FormerieSubmitStatus

Le même que dans `@formerie/vue`, réexporté.

### Nuxt: useFormerieClient

Le même que dans `@formerie/vue`, réexporté.

### Nuxt: useFormerieSubmit

Le même que dans `@formerie/vue`, réexporté.

### Nuxt: UseFormerieSubmitResult

Le même que dans `@formerie/vue`, réexporté.

## Remix

`@formerie/remix`

### Remix: createFormerieRemixAction

Une action Remix qui soumet les données de formulaire de la requête à une cible.

```ts
function createFormerieRemixAction(target: FormerieTarget, options?: CreateFormerieRemixActionOptions): (args: FormerieRemixActionArgs) => Promise<Response>;
```

### Remix: jsonFormerieRemixResponse

Une `Response` JSON à partir d’un résultat de soumission, avec l’état HTTP `202` en cas de réussite et `400` en cas d’échec, sauf si vous les définissez.

```ts
function jsonFormerieRemixResponse(result: SubmitResponse, options?: Pick<CreateFormerieRemixActionOptions, "errorStatus" | "successStatus">): Response;
```

### Remix: CreateFormerieRemixActionOptions

```ts
interface CreateFormerieRemixActionOptions {
    client?: FormerieClient;
    clientConfig?: FormerieClientConfig;
    errorStatus?: number;
    payloadOptions?: CreateFormerieSubmitPayloadOptions;
    submitOptions?: SubmitRequestOptions;
    successStatus?: number;
}
```

### Remix: FormerieRemixActionArgs

```ts
interface FormerieRemixActionArgs {
    request: Request;
}
```

### Remix: FormerieSubmitState

Le même que dans `@formerie/react`, réexporté.

### Remix: FormerieSubmitStatus

Le même que dans `@formerie/react`, réexporté.

### Remix: useFormerieClient

Le même que dans `@formerie/react`, réexporté.

### Remix: useFormerieSubmit

Le même que dans `@formerie/react`, réexporté.

### Remix: UseFormerieSubmitResult

Le même que dans `@formerie/react`, réexporté.
