Skip to content

Vueform Builder landmarks

This page is a functional reading grid for tracking useful parity with Vueform Builder. It does not try to copy its interface: it verifies that QForm Builder covers the same work families inside a Nuxt 4 application, with Quasar 2, FormKit, Pinia and self-hosted data.

Positioning

TopicQForm Builder Community
IntegrationNuxt 4 layer, consumed with extends.
UIQuasar 2, responsive drawers, canvas, catalog, tree and integrated panels.
RuntimeFormViewer replays schemas produced by the builder.
DataVersioned JSON documents, migrations, import/export and isolated autosave.
ExtensibilityPublic catalog, custom panels, validation rules, locales, themes and templates.
HostingSelf-hosted, with no required external service or mandatory telemetry.

Validated feature coverage

The former intermediate badges from the public page are now treated as validated Community features. Topics that do not belong to the Community core are moved outside this grid so product debt is not mixed with Studio tracks.

FamilyStatusWhat is available
Nuxt installationLayer ready for new or existing apps, with an extends example.
Visual builderCatalog, canvas, selection, drag-and-drop, overlays, preview and edit mode.
Public catalogcatalog prop, append or replace mode, defineQFormElement() helper and typed merge.
Interactive fieldsText, number, email, phone, textarea, checkbox, select, dates, files, range, rating, editor and advanced Quasar controls.
Static elementsHeadings, paragraphs, separators, buttons, controlled HTML content and privacy consent.
Nested structuresSections, fieldsets, columns, tabs and steps with unified interaction routing.
Save / load@save, local autosave, JSON import/export, full versioned document and migrations.
Runtime renderingFormViewer supports controlled values, readonly mode, validation, theme and locales.
ConditionsNested groups, typed operators, AND/OR logic and runtime checks.
ValidationFormKit rules, custom messages, public registry and runtime coverage.
Steps / pagesStepper, controlled navigation, duplication, safe deletion and per-step validation.
TreeRecursive view, selection, actions, drag-and-drop and keyboard reordering.
Devices / responsive previewViewport switcher, default, sm, lg presets, diagnostics and auto-fit drawers.
Visible historyUndo/redo, history panel, entry restore, configurable depth and shortcuts.
ThemeTheme Builder, presets, palettes, dark/light, icons and accessible preview.
Field stylesSurfaces, Quasar variants, density, spacing, radius, shadow, width and allowed UnoCSS utilities.
I18n / localesFrench and English included, typed host override through locale and locales.
Custom panelsconfigPanels prop, matcher by type or predicate, priority and internal fallback.
Business rulesvalidationRules prop, typed public rules and localizable messages.
Templates / presetsTemplate registry, Community templates, protected replacement and API application.
Official export / importDedicated dialogs, full document export, schema-only compatibility and migrated import.
Host application integrationPublic ref API, typed events, host-app fixture and verified npm contract.
AccessibilityKeyboard navigation, announcements, focus restore, audited modals and axe WCAG 2.2 AA.

Former yellow badges closed

Former gapCurrent result
Catalog to expose publiclycatalog, catalogMode, defineQFormElement() and public types.
Validation to complete✅ native rules, messages, public registry and runtime tests.
Conditions to extend✅ groups, typed operators and logic simulator.
Steps/pages to strengthen✅ structured stepper, blocking navigation, duplication and controlled deletion.
Real device presets✅ exposed viewports, stable switcher and responsive drawers.
Visible history✅ history panel, undo/redo, restore and shortcuts.
Locale system✅ FR/EN registry, host override and i18n checks.
Theme / design tokens✅ Theme Builder, dark/light, palettes, icons and runtime theme.
Configurable catalog✅ injection, replacement or merge with the Community catalog.
Custom elements✅ typed element definition and rendering through the public catalog.
Custom config panels✅ public registry with matcher and priority.
Builder presets✅ Community templates and applyTemplate() API.
Style panelFieldStylesPanel, serialized styles and runtime cleanup.
Export/import panel✅ official dialogs, versioned JSON and historical schema compatibility.
Database save from the host app@save contract and documented NFZ integration examples without imposing a backend.

Outside the Community scope

Two tracks remain intentionally separate from the Community core: exporting a standalone native Vue component and generating a form from a business description. They bring more value inside NFZ Studio or a dedicated pack, because they involve server architecture, security and maintenance choices that should not make the public layer heavier.

Minimal parity criterion

QForm Builder covers the expected core when a Nuxt 4 application can:

  1. integrate the builder as a public component;
  2. build a complete form without editing internal files;
  3. manage fields, structures, pages, conditions, validation, styles, responsive preview and history;
  4. customize the catalog and configuration panels;
  5. save a versioned JSON document;
  6. replay that document with FormViewer;
  7. connect the full cycle to NFZ Studio or another host application without coupling to playground pages.

This page is checked by bun run vueform:parity:check to prevent unjustified intermediate statuses from coming back in the public documentation.

QForm Builder — Nuxt 4, Quasar and FormKit layer for dynamic forms.