Community Edition

QForm Builder Community est la base gratuite et publiable du projet. Elle doit rester simple à installer, claire à documenter et suffisamment stable pour servir de socle à NFZ Studio ou à une application Nuxt 4 existante.

Objectif

L’édition Community fournit le nécessaire pour créer, sauvegarder et rendre des formulaires dynamiques côté Nuxt 4 :

Nuxt 4 Layer
├── FormBuilder
├── FormViewer
├── multi-instance
├── import/export JSON sécurisé
├── registre public de panneaux personnalisés
├── autosave local
├── conditions avancées ET/OU
├── steps/pages avec validation et réordonnancement
├── validation avancée et registre public de règles
├── Theme Builder et rendu clair/sombre
├── registre public de modèles de formulaires
└── documentation VitePress

Fonctionnalités incluses

Fonctionnalité	Statut Community	Remarque
Nuxt Layer npm	Inclus	Consommation via extends
FormBuilder	Inclus	Composant autonome
FormViewer	Inclus	Rendu runtime
Multi-instance	Inclus	Isolation par builder-id
Autosave local	Inclus	localStorage, clé configurable
Import/export JSON	Inclus	Toolbar, collage, fichier, presse-papiers, téléchargement et API publique sécurisée
Catalogue de champs	Inclus	Basé sur les composants existants
Arborescence	Incluse	Panneau gauche
Panneaux personnalisés	Inclus	Registre public config-panels avec composant Vue typé
Conditions	Incluses	Groupes ET/OU récursifs, éditeurs typés, simulateur et maintenance des références
Steps/pages	Inclus	Réordonnancement, duplication, suppression, états de validation et garde de navigation
Validation avancée	Incluse	Règles typées, regex contrôlée, messages par champ, cross-field et registre public sync/async
Theme Builder	Inclus	Tokens sérialisables, cinq presets, palette, densité et cohérence clair/sombre
Modèles de formulaires	Inclus	Quatre modèles Community, registre hôte, recherche, remplacement/ajout et API publique
Génération NFZ	Cible Studio/Pro	Service NFZ → formulaire CRUD
Formulaire depuis description métier	Cible Pro	À isoler côté serveur

API publique recommandée

Dans une application hôte, privilégier :

<FormBuilder
  builder-id="customer-form"
  v-model:schema="schema"
  v-model:values="values"
  autosave
  @save="saveForm"
/>

Puis :

<FormViewer
  :form-fields="schema"
  v-model="values"
  @submit="submitValues"
/>

Types publics

import type {
  FormBuilderSchema,
  FormBuilderValues,
  FormBuilderSavePayload,
  FormBuilderPublicApi,
  QFormBuilderTemplateRegistry,
  QFormBuilderTemplateApplyEvent,
} from '@vevedh/qform-builder-layer/types'

Ce qui reste interne

Les stores, les panneaux de configuration et les composants internes peuvent évoluer :

app/stores/**
app/components/settings/**
app/components/builder/**
app/composables/form-builder/**

Pour une intégration stable, éviter de dépendre directement de ces fichiers depuis une application consommatrice.

Bonnes pratiques

Utilise toujours un builder-id stable :

<FormBuilder :builder-id="`service-${serviceName}-builder`" />

Dans une application SSR, enveloppe le builder dans ClientOnly :

<ClientOnly>
  <FormBuilder builder-id="admin-builder" />
</ClientOnly>

Le viewer peut être utilisé plus largement, mais il dépend également de FormKit/Quasar. Il reste donc préférable de le tester dans le contexte réel de l’application hôte.

Validation Community

Community inclut le moteur frontend complet : règles FormKit typées, regex contrôlées, messages personnalisés, comparaisons inter-champs et registre public de règles synchrones ou asynchrones. La validation Zod/Feathers côté serveur reste la responsabilité de l’application hôte.

Voir Validation avancée.

Voir Modèles de formulaires pour le registre, les modes replace/append et les garanties de fusion.

Accessibilité Community

Community inclut le parcours clavier du catalogue, du canvas et de l’arborescence, les régions live, la restitution du focus et le gate axe automatisé. Les extensions peuvent utiliser useFormBuilderAccessibility() pour annoncer une action ou replacer le focus sur un champ sans accéder au store interne.

Voir Accessibilité, clavier et audit axe.