Skip to content

Form host for bitboss-ui/validated: owns the vee-validate form (useForm), validates every field on submit, and emits submit with the collected values only when the form is valid.

import { BbForm } from 'bitboss-ui/validated';

On this page

Props

NameTypeDefaultDescription
idstring | undefined-

Explicit id, so anything outside the form can read and drive it through useBbFormContext(id) — a dialog footer's submit button, a page toolbar, a leave guard. Omit it when the form is self-contained: the slot scope already carries the same state for chrome that lives inside.

useBbFormContext(id) reads and drives the form from a dialog footer, toolbar or leave guard. Use a unique explicit id; an auto-generated id cannot be targeted.

See example

Events

NameTypeDescription
submit(event: "submit", values: Record<string, unknown>): void

Return the request promise when isSubmitting should cover it. Fire-and-forget or store-owned requests keep their own pending state.

See example

Slots

The listed properties are the ones exposed to the slot scope.

NameTypeDescription
default{ touched: boolean; dirty: boolean; valid: boolean; pending: boolean; initialValues?: Partial<GenericObject> | undefined; isSubmitting: boolean; resetForm: (state?: Partial<FormState<GenericObject>> | undefined, opts?: Partial<ResetFormOpts> | undefined) => void; submitCount: number; validate: (opts?: Partial<ValidationOptions> | undefined) => Promise<FormValidationResult<GenericObject, GenericObject>>; values: GenericObject; }

isSubmitting covers validation and any promise returned by @submit; it is not a generic request store. resetForm restores values through the controls' bound models and clears validation metadata.

See example