FormForgeBuilder

FormForgeBuilder provides a form-definition editing UI.

<FormForgeBuilder
  v-model="model"
  :autosave="true"
  :autosave-delay="5000"
/>

Builder model shape

{
  uuid: string | null,
  key: string | null,
  schema_version: number,
  title: string,
  publish_at?: string | null,
  pause_at?: string | null,
  response_limit?: number | null,
  submission_code_required?: boolean,
  submission_code?: string | null,
  public_url?: string | null,
  category: string | null,
  pages: FormForgePageSchema[],
  conditions: FormForgeCondition[],
  drafts: { enabled: boolean },
  api: Record<string, unknown>
}

Current field palette

The builder UI currently exposes these field families:

• text for free text
• number
• radio for single choice
• checkbox_group for multiple choice
• consent
• address
• temporal for date and time fields
• file

Standalone builder

Use standalone when the builder lives inside a dedicated admin or playground screen. Combine it with hideSettings when you want the schema editor but not the settings tab.

<FormForgeBuilder
  ref="builder"
  v-model="model"
  standalone
  hide-settings
  auto-publish-on-save
/>

UI control props

Use these props to simplify the builder when you embed it in constrained admin screens.

• disableTitleInput (false)
• disableCategoryControl (false)
• disablePublishAction (false)
• hideSettings (false)
• disableSettingsTab (false, deprecated alias for hideSettings)
• autoPublishOnSave (false)
• defaultPublished (false)
• standalone (false)
• formRouteKey (undefined) loads the first form from a configured form-routes/{key} endpoint when loadFormKey is not provided
• categoryRouteKey (undefined) loads categories from category-routes/{key}

Publication and save behavior

• The settings tab covers opening / closing dates, response limits, and PIN protection
• autoPublishOnSave publishes every successful save, including autosave-driven saves
• defaultPublished only affects the initial publish state in the UI
• hideSettings is runtime-only and is not stored on the form record
• public_url is read-only and comes from the backend resolver when one is configured

<FormForgeBuilder
  v-model="model"
  :hide-settings="true"
  :auto-publish-on-save="true"
/>

Exposed methods

The component ref exposes these methods:

• save()
• publish()
• unpublish()
• togglePublishState()

<script setup lang="ts">
const builder = ref<InstanceType<typeof FormForgeBuilder> | null>(null)

async function saveForm(): Promise<void> {
  await builder.value?.save()
}
</script>

<template>
  <FormForgeBuilder ref="builder" v-model="model" />
  <UButton class="mt-4" @click="saveForm">
    Save
  </UButton>
</template>

Typical usage

• create a new form definition
• patch an existing form definition
• publish and unpublish revisions
• keep a system form published on every save