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 présente l’aperçu et les exemples.
Chaque paquet est une mince couche au-dessus de @formerie/client, alors ses types, comme FormerieTarget, sont dans la référence du client.
React
@formerie/react
React: useFormerieClient
Un FormerieRuntimeClient pour un composant.
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.
function useFormerieSubmit(target: FormerieTarget, config?: FormerieClientConfig): UseFormerieSubmitResult;React: FormerieSubmitState
interface FormerieSubmitState {
status: FormerieSubmitStatus;
result: SubmitResponse | null;
}React: FormerieSubmitStatus
type FormerieSubmitStatus = "idle" | "submitting" | "success" | "error";React: UseFormerieSubmitResult
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.
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.
function useFormerieSubmit(target: MaybeRef<FormerieTarget>, config?: MaybeRef<FormerieClientConfig>): UseFormerieSubmitResult;Vue: FormerieSubmitStatus
type FormerieSubmitStatus = "idle" | "submitting" | "success" | "error";Vue: UseFormerieSubmitResult
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.
function createFormerieClient(config?: FormerieClientConfig): FormerieClient;Svelte: createFormerieRenderModel
Un magasin des champs et des étapes à afficher, qui suit le schéma et les réponses.
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.
function createFormerieSubmit(target: FormerieTarget, config?: FormerieClientConfig): FormerieSubmitStore;Svelte: FormerieReadableInput
type FormerieReadableInput<T> = T | Readable<T>;Svelte: FormerieSubmitStatus
type FormerieSubmitStatus = "idle" | "submitting" | "success" | "error";Svelte: FormerieSubmitStore
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.
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.
function createFormerieSubmit(target: MaybeAccessor<FormerieTarget>, config?: MaybeAccessor<FormerieClientConfig>): CreateFormerieSubmitResult;Solid: CreateFormerieSubmitResult
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
type FormerieSubmitStatus = "idle" | "submitting" | "success" | "error";Solid: MaybeAccessor
type MaybeAccessor<T> = T | Accessor<T>;Angular
@formerie/angular
Angular: FORMERIE_CLIENT_CONFIG
Le jeton d’injection des réglages du client. Facultatif.
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.
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.
function createFormerieClient(config?: FormerieClientConfig): FormerieClient;Astro: createFormerieFormAttributes
Les attributs data-formerie-* d’un <form>, avec les adresses de sa cible.
function createFormerieFormAttributes(target: FormerieTarget, options?: FormerieAstroFormAttributesOptions): Record<string, string>;Astro: FormerieAstroFormAttributesOptions
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 pour ses limites.
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.
function createFormerieNextServerHelpers(target: FormerieTarget, options?: CreateFormerieNextActionOptions): FormerieNextServerHelpers;Next: CreateFormerieNextActionOptions
interface CreateFormerieNextActionOptions {
client?: FormerieClient;
clientConfig?: FormerieClientConfig;
payloadOptions?: CreateFormerieSubmitPayloadOptions;
submitOptions?: SubmitRequestOptions;
}Next: FormerieNextServerHelpers
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.
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.
function createFormerieNuxtSubmitHandler<Event = unknown>(target: FormerieTarget, options: CreateFormerieNuxtSubmitHandlerOptions<Event>): (event: Event) => Promise<SubmitResponse>;Nuxt: CreateFormerieNuxtSubmitHandlerOptions
interface CreateFormerieNuxtSubmitHandlerOptions<Event = unknown> {
client?: FormerieClient;
clientConfig?: FormerieClientConfig;
payloadOptions?: CreateFormerieSubmitPayloadOptions;
readFormData: (event: Event) => Promise<FormData> | FormData;
submitOptions?: SubmitRequestOptions;
}Nuxt: FormerieNuxtRuntimeConfig
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.
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.
function jsonFormerieRemixResponse(result: SubmitResponse, options?: Pick<CreateFormerieRemixActionOptions, "errorStatus" | "successStatus">): Response;Remix: CreateFormerieRemixActionOptions
interface CreateFormerieRemixActionOptions {
client?: FormerieClient;
clientConfig?: FormerieClientConfig;
errorStatus?: number;
payloadOptions?: CreateFormerieSubmitPayloadOptions;
submitOptions?: SubmitRequestOptions;
successStatus?: number;
}Remix: FormerieRemixActionArgs
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é.