PHPackages                             digiti/form-builder - PHPackages - PHPackages  [Skip to content](#main-content)[PHPackages](/)[Directory](/)[Categories](/categories)[Trending](/trending)[Leaderboard](/leaderboard)[Changelog](/changelog)[Analyze](/analyze)[Collections](/collections)[Log in](/login)[Sign up](/register)

1. [Directory](/)
2. /
3. [Utility &amp; Helpers](/categories/utility)
4. /
5. digiti/form-builder

ActiveProject[Utility &amp; Helpers](/categories/utility)

digiti/form-builder
===================

Form Builder Package

v3.0.0(1y ago)0825—0%MITPHPPHP ^8.2

Since Aug 2Pushed 1y ago2 watchersCompare

[ Source](https://github.com/digiti/form-builder)[ Packagist](https://packagist.org/packages/digiti/form-builder)[ RSS](/packages/digiti-form-builder/feed)WikiDiscussions main Synced 1mo ago

READMEChangelog (10)Dependencies (2)Versions (44)Used By (0)

Form Builder
============

[](#form-builder)

[![Latest Version on Packagist](https://camo.githubusercontent.com/c0de3dad71980ef3a77ec044b6aaf258546ed63937af04f5c51655267bd2484a/68747470733a2f2f696d672e736869656c64732e696f2f7061636b61676973742f762f6469676974692f666f726d2d6275696c6465722e7376673f7374796c653d666c61742d737175617265)](https://packagist.org/packages/digiti/form-builder)[![Total Downloads](https://camo.githubusercontent.com/4879e7bd84985f2762361ab225e224c3ed6571e27287c476ef0584edbc4e86c5/68747470733a2f2f696d672e736869656c64732e696f2f7061636b61676973742f64742f6469676974692f666f726d2d6275696c6465722e7376673f7374796c653d666c61742d737175617265)](https://packagist.org/packages/digiti/form-builder)

This is a minimalist form builder build on Livewire V3. This is mainly used to create multi-step forms with reactive fields and content.

Installation
------------

[](#installation)

In order for this package to work you need to have completed the [Livewire v3 installation guide](https://livewire.laravel.com/docs/installation). Once you have done that you include this package in your composer file.

```
composer require digiti/form-builder

```

To include the basic styling you need to add the import below in the main css file of your project.

`@import '/vendor/digiti/form-builder/dist/build/assets/main.css';`

Forms
=====

[](#forms)

Once you completed the installation you can immediatly start creating forms with the handy command below:

```
php artisan make:form YourFormName

```

This will generate the base file structure which is needed to use the existing form component of this package.

A form needs a name. This name will be used to link the results to the form. So it has to be unique. By default all results will be stored in as a cookie.

```
public string $name = 'FormExample';

```

This is where you create the whole schema for your new form:

```
public function schema(): array
    {
        return [
            ...
        ];
    }

```

With the submit method you do whatever with your data on a form submit

```
public function submit(): void
    {
        //OnFormSubmitted::dispatch($this->result);
    }

```

A form can show an overview/conclusion of all data related to the form. To activate this you have to provide the following public variable in your form class.

```
public bool $hasConclusion = true

```

When Submitted it fires a event `OnFormSubmitted` which can be used to hook on your custom logic for saving or sending the results somewhere. Other available events:

- `OnStepCompleted`
- `OnChapterCompleted`

### Methods:

[](#methods)

**schema()**Define your chapters and inputs here in an array. This will be automagically be converted in a functional form.

```
public function schema()
{
	return [
		Text::make('firstname')
			->type('text'),
		Text::make('lastname')
			->type('text'),
		Text::make('lastname')
			->email()
	];
}

```

Fieldtypes
==========

[](#fieldtypes)

When constructing your form you make use of these fieldtype classes to build each input.

They can be nested in 'Chapters' but more on that later.

> **Note:** The **make($string)** method is required to construct a fieldtype object

Fieldtype options:

- -&gt;label(): Label for the input. If not provide we will create a label with the name of the field.
- -&gt;required(): Makes field required.

Text
----

[](#text)

First of all you have the Text fieldtype.

A example:

```
use App\Fieldtypes\Text;

Text::make('firstname')->type('text')->required()

```

### Methods:

[](#methods-1)

**type($string)**Changes the text input type to the value provided in `$string`

```
Text::make('firstname')->type("text"),

```

**email()**Changes the text input type to email

> Validation: email

```
Text::make('email')->email(),

```

**integer()**Changes the text input type to integer

> Validation: integer

```
Text::make('quantity')->integer(),

```

**password()**Changes the text input type to password

> Validation: password

```
Text::make('password_confirmation')->password(),

```

**tel()**Changes the text input type to tel

```
Text::make('phone')->tel(),

```

**url()**Changes the text input type to url

> Validation: url

```
Text::make('website')->url(),

```

Radiobuttons
------------

[](#radiobuttons)

A example:

```
use App\Fieldtypes\Radio;

Radio::make('radio')
    ->label('Select one option')
    ->options([
        "yes" => "Yes please",
        "no" => "God no!",
    ])

```

### Methods

[](#methods-2)

**label**Will overwrite the name with the given label

```
Radio::make('radio')->label('Select one option')

```

**options(array())**Constructs the options of your select input. The key will be the value that is being stored. When you only provide a label, radiobuttons will be shown. If you add an asset, this will hide the radiobutton and only show the assets

```
Radio::make('radio')
    ->options([
        "app" => [
            "label" => "App",
            "asset" => "https://media.giphy.com/media/9ohlKnRDAmotG/giphy.gif"
        ],
        "website" => [
            "label" => "Website",
            "asset" => "https://media.giphy.com/media/rGuYfsb6WlKyk/giphy.gif"
        ],
        "webshop" => [
            "label" => "Webshop",
            "asset" => "https://media.giphy.com/media/Lq0h93752f6J9tijrh/giphy.gif"
        ],
    ]),

```

Checkboxes
----------

[](#checkboxes)

A example:

```
use App\Fieldtypes\Check;

Check::make('Options')
    ->label('Select multiple options')
    ->options([
        "option-1" => "Option one",
        "option-2" => "Option two",
        "option-3" => "Option three"
    ])

```

### Methods

[](#methods-3)

**single checkbox**Creates 1 checkbox. The value will the name. If this needs to be overwritten check the 'label' option

```
Check::make('Consent')

```

**label(string)**Will overwrite the name with the given label

```
Check::make('Consent')->label('I agree with the terms and conditions')

```

**options(array())**Constructs the options of your select input. The key will be the value that is being stored. When you only provide a label, radiobuttons will be shown. If you add an asset, this will hide the radiobutton and only show the assets

```
Check::make('platform')
    ->options([
        "app" => [
            "label" => "App",
            "asset" => "https://media.giphy.com/media/9ohlKnRDAmotG/giphy.gif"
        ],
        "website" => [
            "label" => "Website",
            "asset" => "https://media.giphy.com/media/rGuYfsb6WlKyk/giphy.gif"
        ],
        "webshop" => [
            "label" => "Webshop",
            "asset" => "https://media.giphy.com/media/Lq0h93752f6J9tijrh/giphy.gif"
        ],
    ]),

```

Range slider
------------

[](#range-slider)

A example:

```
use App\Fieldtypes\Range;
Range::make('amount')
    ->min(10)
    ->max(200)
    ->step(50)

```

### Methods

[](#methods-4)

**label(string)**Will overwrite the name with the given label

```
Range::make('amount')->label('Slide for the correct amount')

```

**min(integer)**Set minimum value of slider

> Validation: min:{amount}

```
Range::make('amount')->min(10)

```

**max(integer)**Set maximum value of slider

> Validation: max:{amount}

```
Range::make('amount')->max(200)

```

**step(integer)**Set the step of slider

```
Range::make('amount')->step(50)

```

Select
------

[](#select)

A example:

```
use App\Fieldtypes\Select;

Select::make('role')
    ->options([
        "option-1" => "Option one",
        "option-2" => "Option two",
        "option-3" => "Option three"
    ])
    ->multiple()

```

### Methods

[](#methods-5)

**options(array())**Constructs the options of your select input. The key will be the value that is being stored. When you only provide a label, radiobuttons will be shown. If you add an asset, this will hide the radiobutton and only show the assets

```
Select::make('platform')
    ->options([
        "app" => [
            "label" => "App",
            "asset" => "https://media.giphy.com/media/9ohlKnRDAmotG/giphy.gif"
        ],
        "website" => [
            "label" => "Website",
            "asset" => "https://media.giphy.com/media/rGuYfsb6WlKyk/giphy.gif"
        ],
        "webshop" => [
            "label" => "Webshop",
            "asset" => "https://media.giphy.com/media/Lq0h93752f6J9tijrh/giphy.gif"
        ]
    ]),

```

**multiple()**This method enables you to select multiple options

```
Select::make('Multi select')->options([...])->multiple(),

```

Validation
----------

[](#validation)

Validation plays a crucial role in the construction of your form. Each fieldtype is equipped with a set of general accessible methods designed to assist you in validating user inputs.

> Furthermore, certain specific fieldtype methods automatically incorporate fundamental validation rules. We have included the validation rule within each method where applicable.

**Required()**

```
Text::make('first-name')->required()

```

**rawRule(string, bool)**With rawRule() you can add your own validation rules. all validation rules you define will be added to already defined rules in other methods. If you want to overwrite all automaticlly set validation rules you can switch the optional $overwrite attribute to true

```
Text::make('email')->email()->rawRule('required|min:4') // email|required|min:4
Text::make('email')->email()->rawRule('required|min:4', true) // required|min:4

```

> You can add your own custom validations with the method above. Check out the Laravel documentation on [Custom validation rules](https://laravel.com/docs/10.x/validation#custom-validation-rules) to create your own.

Layout
======

[](#layout)

Steps
=====

[](#steps)

You can think of steps like screens. A step can have multiple fieldtypes and will show them step per step.

A example:

```
Step::make([
    Text::make('first-name')
        ->type('text')
        ->label('First name')
        ->required(),
    Text::make('last-name')
        ->type('text')
        ->label('Last name')
        ->required(),
    Text::make('email')
        ->type('email')
        ->required(),
    Text::make('company')
        ->type('text')
        ->required(),
])

```

### Methods

[](#methods-6)

**title**Adds a title to the step

```
Step::make([])->title('Please provide us with your contact details')

```

**description**Adds a description to step

```
Step::make([])->desccription('Please provide us with your contact details')

```

**reactive**Makes a step conditional. The function should return a boolean. This wil result in hiding/showing of the step based on input In the example you see this step will only be shown when the 'company' field exists and is 'Digiti'

```
Step::make([])->reactive(function () {
    return isset($this->result['company']) && $this->result['company'] == 'Digiti' ? true : false;
})

```

Chapters
========

[](#chapters)

Chapter have multiple steps and can be reactive

A example:

```
Chapter::make([
    Step::make([
        Text::make('first-name')
            ->type('text')
            ->label('First name')
            ->required(),
    ]),
    Step::make([
        Text::make('last-name')
            ->type('text')
            ->label('Last name')
            ->required(),
    ])
])

```

### Methods

[](#methods-7)

**title**Adds a title to the step

```
Chapter::make([])->title('Please provide us with your contact details')

```

**description**Adds a description to step

```
Chapter::make([])->desccription('Please provide us with your contact details')

```

**reactive**Makes a step conditional. The function should return a boolean. This wil result in hiding/showing of the step based on input

In the example you see this step will only be shown when the 'company' field exists and is 'Digiti'

```
Chapter::make([])->reactive(function () {
    return isset($this->result['company']) && $this->result['company'] == 'Digiti' ? true : false;
})

```

**conclusion**A chapter can show an overview of all data related to the chapter.

Row
---

[](#row)

A row is used to wrap Columns. The behaviour is the same as in Bootstrap. Row is not dynamic is html only. You can overwrite default classes to overwrite default styling

```
Row::make([
Column::make([
// Coulmn stuff
])
Column::make([
// other Coulmn stuff
])
])

```

**classes()**This methods lets you overwrite classes.

```
Row::make([])->classes('custom-class')

```

Column
------

[](#column)

A Column needs a Row as parent. The behaviour is the same as in Bootstrap.

```
Row::make([
    Column::make([
        // Column stuff
    ]),
    Column::make([
        // other Column stuff
    ])
])

```

**classes()**This methods lets you overwrite classes.

```
Column::make([])->classes('custom-class')

```

Heading
-------

[](#heading)

Let's you create a html heading. Use the level function to select the heading type

```
Heading::make('This is a title')->level(1)
// This example will result in:
// This is a title

```

**classes()**This methods lets you overwrite classes.

```
Heading::make('Heading')->classes('custom-class')

```

Paragraph
---------

[](#paragraph)

```
Paragraph::make('Lorem ipsum dolor sit amet, consectetur adipiscing elit. Donec nec semper quam. Maecenas ut orci dapibus, sodales quam quis, tincidunt nunc. Sed ultricies dui turpis, id finibus eros tincidunt ac.')

// This example will result in:

// Lorem ipsum dolor sit amet, consectetur adipiscing elit. Donec nec semper quam. Maecenas ut orci dapibus, sodales quam quis, tincidunt nunc. Sed ultricies dui turpis, id finibus eros tincidunt ac.

```

**classes()**This methods lets you overwrite classes.

```
Paragraph::make('paragraph')->classes('custom-class')

```

Anchor
------

[](#anchor)

```
Anchor::make('http://www.google.com')->label('Google it')
// This example will result in:
// Google it

```

**classes()**This methods lets you overwrite classes.

```
Anchor::make('http://www.google.com')->classes('custom-class')

```

**target()**This methods let's you set the target of a link.

```
Anchor::make('http://www.google.com')->target('_blank')

```

**rel()**This methods let's you set the relationship between a linked resource and the current document.

```
Anchor::make('http://www.google.com')->target('_blank')->rel('noopener noreferrer')

```

Html
----

[](#html)

```
Html::make('Test title')

```

Image
-----

[](#image)

```
Image::make('/assets/color-icon-automation-dark.svg')

```

**classes()**This methods lets you overwrite classes.

```
Image::make('/assets/color-icon-automation-dark.svg')->classes('custom-class')

```

###  Health Score

38

—

LowBetter than 85% of packages

Maintenance41

Moderate activity, may be stable

Popularity17

Limited adoption so far

Community11

Small or concentrated contributor base

Maturity69

Established project with proven stability

 Bus Factor1

Top contributor holds 98.2% of commits — single point of failure

How is this calculated?**Maintenance (25%)** — Last commit recency, latest release date, and issue-to-star ratio. Uses a 2-year decay window.

**Popularity (30%)** — Total and monthly downloads, GitHub stars, and forks. Logarithmic scaling prevents top-heavy scores.

**Community (15%)** — Contributors, dependents, forks, watchers, and maintainers. Measures real ecosystem engagement.

**Maturity (30%)** — Project age, version count, PHP version support, and release stability.

###  Release Activity

Cadence

Every ~13 days

Recently: every ~101 days

Total

39

Last Release

488d ago

Major Versions

v1.1.0 → v2.0.02023-11-30

v2.0.2 → v3.0.02025-01-06

PHP version history (2 changes)1.0.0PHP ^8.1

v3.0.0PHP ^8.2

### Community

Maintainers

![](https://www.gravatar.com/avatar/a828a1f7e9345cecc7a69f449aa798494609e077daff0a6bb5bb872439dbeb9b?d=identicon)[TheRealJanJanssens](/maintainers/TheRealJanJanssens)

![](https://www.gravatar.com/avatar/92f81b4f41607685af0185ba57aeb1cca3de960f313fbb2a517bc48d94511b74?d=identicon)[digiti-developers](/maintainers/digiti-developers)

---

Top Contributors

[![TheRealJanJanssens](https://avatars.githubusercontent.com/u/28360647?v=4)](https://github.com/TheRealJanJanssens "TheRealJanJanssens (55 commits)")[![jasperVandeVloet](https://avatars.githubusercontent.com/u/39418190?v=4)](https://github.com/jasperVandeVloet "jasperVandeVloet (1 commits)")

### Embed Badge

![Health badge](/badges/digiti-form-builder/health.svg)

```
[![Health](https://phpackages.com/badges/digiti-form-builder/health.svg)](https://phpackages.com/packages/digiti-form-builder)
```

###  Alternatives

[livewire/volt

An elegantly crafted functional API for Laravel Livewire.

4195.3M84](/packages/livewire-volt)[ramonrietdijk/livewire-tables

Dynamic tables for models with Laravel Livewire

21147.4k](/packages/ramonrietdijk-livewire-tables)[namu/wirechat

A Laravel Livewire messaging app for teams with private chats and group conversations.

54324.5k](/packages/namu-wirechat)[marcorieser/statamic-livewire

A Laravel Livewire integration for Statamic.

2381.5k10](/packages/marcorieser-statamic-livewire)[aerni/livewire-forms

A Statamic forms framework powered by Laravel Livewire

2912.8k](/packages/aerni-livewire-forms)[team-nifty-gmbh/tall-datatables

A package to create datatables using alpinejs, tailwind, livewire and laravel

1217.2k1](/packages/team-nifty-gmbh-tall-datatables)

PHPackages © 2026

[Directory](/)[Categories](/categories)[Trending](/trending)[Changelog](/changelog)[Analyze](/analyze)
