PHPackages                             skyraptor/filament-blocks-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. skyraptor/filament-blocks-builder

ActiveLibrary

skyraptor/filament-blocks-builder
=================================

This Filament PHP plugin adds a BlockBuilder form component, that allows you to create layouts using Blocks. This can be used as a builder for anything: layout, content, data and more.

0.4.0(6mo ago)231.5k↓100%6[1 issues](https://github.com/bumbummen99/filament-blocks-builder/issues)[1 PRs](https://github.com/bumbummen99/filament-blocks-builder/pulls)GPL-3.0-onlyPHPPHP ^8.3CI passing

Since Oct 29Pushed 6mo ago2 watchersCompare

[ Source](https://github.com/bumbummen99/filament-blocks-builder)[ Packagist](https://packagist.org/packages/skyraptor/filament-blocks-builder)[ RSS](/packages/skyraptor-filament-blocks-builder/feed)WikiDiscussions master Synced 1mo ago

READMEChangelog (3)Dependencies (5)Versions (18)Used By (0)

[![Filament Blocks Builder Thumbnail](./docs/assets/thumbnail.jpg)](./docs/assets/thumbnail.jpg)

Filament PHP Blocks Builder
===========================

[](#filament-php-blocks-builder)

[![Tests](https://github.com/bumbummen99/filament-blocks-builder/actions/workflows/tests.yml/badge.svg)](https://github.com/bumbummen99/filament-blocks-builder/actions/workflows/tests.yml)[![Codecov](https://camo.githubusercontent.com/63ff37bc1791ebd5a0036dc5b7529897a2127b0f9581d53fc80ba9e36ef3b4b8/68747470733a2f2f636f6465636f762e696f2f6769746875622f62756d62756d6d656e39392f66696c616d656e742d626c6f636b732d6275696c6465722f67726170682f62616467652e7376673f746f6b656e3d43515544474646313530)](https://codecov.io/github/bumbummen99/filament-blocks-builder)[![Filament Version](https://camo.githubusercontent.com/fd5d86622ec3573cc76fbda4e72ce16bb431abc6437d2c2ba7316f2d1a4b2146/68747470733a2f2f696d672e736869656c64732e696f2f7061636b61676973742f646570656e64656e63792d762f736b79726170746f722f66696c616d656e742d626c6f636b732d6275696c6465722f66696c616d656e74253246666f726d733f6c6162656c3d66696c616d656e74)](https://github.com/filamentphp/filament/)[![Stable Version](https://camo.githubusercontent.com/7256455394bf770d86fafe885327825f8b3f677fedbac5001756f2df2e035ce5/68747470733a2f2f696d672e736869656c64732e696f2f7061636b61676973742f762f736b79726170746f722f66696c616d656e742d626c6f636b732d6275696c6465723f6c6162656c3d737461626c65)](https://packagist.org/packages/skyraptor/filament-blocks-builder)[![Total Downloads](https://camo.githubusercontent.com/6299fa5e63995b630d78dcd670d68423e5a9c2a316df97058432d5e674ced59d/68747470733a2f2f696d672e736869656c64732e696f2f7061636b61676973742f64742f736b79726170746f722f66696c616d656e742d626c6f636b732d6275696c646572)](https://packagist.org/packages/skyraptor/filament-blocks-builder)[![License](https://camo.githubusercontent.com/8685b1eb3f47cb6b6724f9ae95b5f5ed64e4a58a32f4b6685043adb00f30ab48/68747470733a2f2f696d672e736869656c64732e696f2f6769746875622f6c6963656e73652f62756d62756d6d656e39392f66696c616d656e742d626c6f636b732d6275696c646572)](https://github.com/bumbummen99/filament-blocks-builder/blob/master/LICENSE)

**Filament PHP Blocks Builder** is a plugin that adds a [`BlocksInput`](https://github.com/bumbummen99/filament-blocks-builder/blob/master/src/Forms/Components/BlocksInput.php) form component, enabling you to design layouts using blocks on any resource you like. This flexible tool is suitable for building layouts, managing content, structuring data, and more.

📸Screenshots
------------

[](#screenshots)

Check out screenshots of the form components offerend by this package in [the screenshots directory](https://github.com/bumbummen99/filament-blocks-builder/blob/master/docs/SCREENSHOTS.md).

---

🚀Installation
-------------

[](#installation)

Install the plugin via Composer:

```
composer require skyraptor/filament-blocks-builder
```

---

📘Useage
-------

[](#useage)

### Adding the BlocksInput

[](#adding-the-blocksinput)

The [`BlocksInput`](https://github.com/bumbummen99/filament-blocks-builder/blob/master/src/Forms/Components/BlocksInput.php) is a Form component that can be added to any Filament PHP resource or form. Here’s how to use the [`BlocksInput`](https://github.com/bumbummen99/filament-blocks-builder/blob/master/src/Forms/Components/BlocksInput.php):

```
use SkyRaptor\FilamentBlocksBuilder\Blocks;
use SkyRaptor\FilamentBlocksBuilder\Forms\Components\BlocksInput;

BlocksInput::make('content')
    ->blocks(fn () => [
        Blocks\Layout\Card::block($schema),
        Blocks\Typography\Heading::block($schema),
        Blocks\Typography\Paragraph::block($schema)
    ])
```

> **Note:** The `BlocksInput` Form component will output it's data as an array. You must ensure that the Model does cast the attribute as described in [the Laravel documentation](https://laravel.com/docs/12.x/eloquent-mutators#array-and-json-casting).

### Creating Blocks

[](#creating-blocks)

A Block itself is a combination of a Filament PHP Form definition, the view for the frontend combined with all Logic required to proccess the Block:

1. A **Filament PHP Form schema** for Block data definiton
2. A **Blade view** for frontend rendering

The package does include basic example Blocks, however it is **recommended** that you do create and maintain your own library of Blocks - this can be done in your project as well as in a package.

#### Implement the Block

[](#implement-the-block)

Create a new class for your Block, extend the [`Block`](https://github.com/bumbummen99/filament-blocks-builder/blob/master/src/Blocks/Contracts/Block.php) Contract and implement the required methods:

```