React Form Management Library | Dashforge-UI
Dashforge-UI
DocsStarter Kits
LoginGet Started

React forms withrules, not effects

MUI-native form library with React Hook Form integration, built-in RBAC, and a reactive engine for complex conditional logic. Build enterprise forms without scattered useEffect hooks.

Get StartedSee Examples

Works with:

React 19

React Hook Form

Material-UI v7

TypeScript

Why Dashforge

React Hook Form handles inputs — Dashforge adds reactive rules and conditional logic

Material-UI provides components — Dashforge integrates them with form state and RBAC

Build complex forms without scattered useEffect hooks or manual dependency tracking

Real Code Example

category: "bug"details field appears

Conditional visibility — powered by the reactive engine.

Everything you need for complex forms

Conditional Logic Made Simple


Show/hide fields and sections based on rules. No manual useEffect dependencies.

Built-in RBAC


Control field visibility and editability with access rules. No scattered permission checks.

Reactive Form State


Field dependencies update automatically. Changes propagate instantly and predictably.

MUI-Native Components

TextField

Select

Autocomplete

Checkbox

Radio

Switch

DatePicker

Button


Built on proven technology

TypeScript-first architecture with React 19, Material-UI v7, and React Hook Form at the core.

TypeScript-first

React 19

MUI v7-native

React Hook Form

RBAC-ready

Docs-first


Dashforge combines MUI-native components, reactive form logic, and RBAC-ready primitives in one integrated system.


From wiring to declarative form logic

The same conditional form pattern — with and without orchestration code.

MUI + React Hook Form

function SupportForm() {
  const { control, watch } = useForm();
  const category = watch('category');

  return (
    <form>
      <Controller
        name="category"
        control={control}
        rules={{ required: 'Category is required' }}
        render={({ field, fieldState }) => (
          <Select
            {...field}
            error={!!fieldState.error}
          >
            <MenuItem value="bug">Bug</MenuItem>
            <MenuItem value="feature">Feature</MenuItem>
            <MenuItem value="billing">Billing</MenuItem>
          </Select>
        )}
      />

      {category === 'bug' && (
        <Controller
          name="details"
          control={control}
          rules={{
            validate: (value) =>
              value?.trim()
                ? true
                : 'Details required for bugs'
          }}
          render={({ field, fieldState }) => (
            <TextField
              {...field}
              label="Bug Details"
              error={!!fieldState.error}
              helperText={fieldState.error?.message}
            />
          )}
        />
      )}
    </form>
  );
}

Manual error wiring, watch(), conditional rendering

Dashforge

function SupportForm() {
  return (
    <DashForm onSubmit={handleSubmit}>
      <Select
        name="category"
        label="Category"
        options={[
          { value: 'bug', label: 'Bug' },
          { value: 'feature', label: 'Feature' },
          { value: 'billing', label: 'Billing' },
        ]}
        rules={{ required: 'Category is required' }}
      />

      <TextField
        name="details"
        label="Bug Details"
        visibleWhen={(engine) =>
          engine.getNode('category')?.value === 'bug'
        }
        rules={{
          validate: (value, form) =>
            value?.trim()
              ? true
              : 'Details required for bugs'
        }}
      />
    </DashForm>
  );
}

Validation and errors handled automatically


Solve common form problems

Complex form patterns without the complexity.

Conditional Visibility

Show/hide fields based on other field values without useEffect chains.


Declare visibility rules once

No manual event listeners or watchers

Cross-Field Dependencies

Update one field automatically when another changes — no stale closures.


Explicit dependency declarations

Guaranteed consistency across updates

Server-Side Validation

Handle async validation rules without managing loading states manually.


Built-in async rule support

Automatic loading and error states

Multi-Step Forms

Gate wizard steps based on completion rules and user permissions.


Declarative step visibility

Progress tracking derived from rules


Stop fighting with useEffect

Dashforge replaces scattered effects with declarative rules. Field dependencies update automatically, async validation is built-in, and RBAC works out of the box.

Typical approach


useEffect hooks for field dependencies

Manual state synchronization

Scattered permission checks

Complex async coordination

Dashforge


Declarative rules and automatic updates

Built-in reactive state engine

Integrated RBAC on every component

First-class async rule support


How it works: Declare rules once. Dashforge watches field changes and updates dependent fields automatically.

No manual state tracking. No stale closures. No effect dependencies to maintain.


Ready to build better forms?

Get started in minutes with our quickstart guide and working examples.

Read the DocsBrowse Examples