Vyuh CDX

Appearance

Installation ​

The Vyuh Form system is split into two packages: a runtime library for rendering and managing forms, and an editor library for visually designing them.

Requirements

  • Dart SDK 3.9 or higher
  • Flutter 3.32 or higher
  • A Vyuh Framework project with vyuh_core configured

Authenticate with pub.vyuh.tech first

The Form Editor packages is hosted on the private pub.vyuh.tech registry. Before running pub get, register a Bearer token issued by Vyuh Technologies based on your plan.

Run the one-time setup:

dart pub token add https://pub.vyuh.tech

Don't have a token yet? Email ask@vyuh.tech to request one. For full details (CI, Docker, rotation, troubleshooting), see the Pub Token Setup guide.

Add Dependencies

Add vyuh_feature_forms and vyuh_form_editor  to your pubspec.yaml as hosted dependencies:

pubspec.yaml

Then resolve dependencies:

Run the code generator to materialize the *.g.dart files:

Setup

Packages ​

PackagePurpose
vyuh_feature_formsForm runtime — models, field types, validation, rules, step forms, FormBuilder DSL
vyuh_form_editorVisual designer — drag-drop canvas, field palette, properties panel, import/export

Feature Registration ​

Register the forms feature in your Vyuh application using a FeatureDescriptor:

dart
import 'package:vyuh_feature_forms/vyuh_feature_forms.dart' as forms;

// In your app's feature list
final features = [
  forms.feature,
  // ... other features
];

The forms.feature descriptor registers all built-in components:

  • 12 field types -- TextField, NumberField, SelectField, BooleanField, DateTimeField, SliderField, RangeSliderField, PhoneNumberField, ImagePickerField, FilePickerField, FormulaField, ReferenceField
  • Content builders -- Form, FormRowBlock, FormSection, RepeatingSection, StepForm, and all field content builders
  • Validations -- Required, Email, URL, Pattern, TextLength, MinLength, MaxLength, NumberRange, DateRange, CreditCard, IpAddress, FutureDateValidation, PastDateValidation, BusinessHoursValidation, DateDependencyValidation, SoftRangeValidation
  • Async validations -- CustomAsyncValidation
  • Conditions -- BooleanCondition, CompoundCondition, EmptyCondition, StringCondition, NumericCondition, DateCondition
  • Actions -- VisibilityAction, EnabledAction, FocusAction, SetValueAction, CompoundAction, ValidationAction
  • Layouts -- StepForm layouts (Default, VerticalStepper, SingleStep), SelectField layouts, BooleanField layouts, ReferenceField layouts

Editor Setup ​

If you are using the visual form editor, create a FormEditorStore:

dart
import 'package:vyuh_form_editor/vyuh_form_editor.dart';

// Simple setup with all defaults
final store = FormEditorStore.withDefaults();

// Or use descriptors for customization
final store = FormEditorStore.fromDescriptors([
  FormEditorDescriptor.withDefaults(),
]);

Then use the FormEditor widget:

dart
FormEditor(
  store: store,
  onFieldsChanged: (fields) {
    // React to field changes
  },
)

Imports ​

The runtime package has a single barrel export:

dart
// All runtime types
import 'package:vyuh_feature_forms/vyuh_feature_forms.dart';

// DSL builder (if using the fluent API)
import 'package:vyuh_feature_forms/dsl/form_builder.dart';

Next Steps ​