{"id":20532505,"url":"https://github.com/bumbummen99/filament-blocks-builder","last_synced_at":"2025-09-25T14:31:22.871Z","repository":{"id":260132299,"uuid":"865069690","full_name":"bumbummen99/filament-blocks-builder","owner":"bumbummen99","description":"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.","archived":false,"fork":false,"pushed_at":"2025-06-20T22:37:06.000Z","size":614,"stargazers_count":20,"open_issues_count":3,"forks_count":4,"subscribers_count":3,"default_branch":"master","last_synced_at":"2025-09-25T02:58:36.555Z","etag":null,"topics":["blocks","builder","filament","filament-form","filament-forms","filament-plugin","filamentphp","filamentphp-plugin","hacktoberfest","laravel","laravel-package","layoutbuilder","pagebuilder"],"latest_commit_sha":null,"homepage":"","language":"PHP","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":"gpl-3.0","status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/bumbummen99.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":"docs/CONTRIBUTING.md","funding":null,"license":"LICENSE","code_of_conduct":"docs/CODE_OF_CONDUCT.md","threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":"docs/SECURITY.md","support":null,"governance":null,"roadmap":null,"authors":null,"dei":null,"publiccode":null,"codemeta":null,"zenodo":null}},"created_at":"2024-09-29T22:39:44.000Z","updated_at":"2025-08-06T13:54:26.000Z","dependencies_parsed_at":null,"dependency_job_id":"2c5e052e-16a0-4708-a01c-0af5658fe3dc","html_url":"https://github.com/bumbummen99/filament-blocks-builder","commit_stats":null,"previous_names":["bumbummen99/filament-blocks-builder"],"tags_count":2,"template":false,"template_full_name":null,"purl":"pkg:github/bumbummen99/filament-blocks-builder","repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/bumbummen99%2Ffilament-blocks-builder","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/bumbummen99%2Ffilament-blocks-builder/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/bumbummen99%2Ffilament-blocks-builder/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/bumbummen99%2Ffilament-blocks-builder/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/bumbummen99","download_url":"https://codeload.github.com/bumbummen99/filament-blocks-builder/tar.gz/refs/heads/master","sbom_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/bumbummen99%2Ffilament-blocks-builder/sbom","scorecard":null,"host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":276932128,"owners_count":25730734,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2022-07-04T15:15:14.044Z","status":"online","status_checked_at":"2025-09-25T02:00:09.612Z","response_time":80,"last_error":null,"robots_txt_status":"success","robots_txt_updated_at":"2025-07-24T06:49:26.215Z","robots_txt_url":"https://github.com/robots.txt","online":true,"can_crawl_api":true,"host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":["blocks","builder","filament","filament-form","filament-forms","filament-plugin","filamentphp","filamentphp-plugin","hacktoberfest","laravel","laravel-package","layoutbuilder","pagebuilder"],"created_at":"2024-11-16T00:15:17.268Z","updated_at":"2025-09-25T14:31:22.860Z","avatar_url":"https://github.com/bumbummen99.png","language":"PHP","funding_links":[],"categories":[],"sub_categories":[],"readme":"![Filament Blocks Builder Thumbnail](./docs/assets/thumbnail.jpg)\n# Filament PHP Blocks Builder\n[![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)\n[![Codecov](https://codecov.io/github/bumbummen99/filament-blocks-builder/graph/badge.svg?token=CQUDGFF150)](https://codecov.io/github/bumbummen99/filament-blocks-builder)\n[![Filament Version](https://img.shields.io/packagist/dependency-v/skyraptor/filament-blocks-builder/filament%2Fforms?label=filament)](https://github.com/filamentphp/filament/)\n[![Stable Version](https://img.shields.io/packagist/v/skyraptor/filament-blocks-builder?label=stable)](https://packagist.org/packages/skyraptor/filament-blocks-builder)\n[![Total Downloads](https://img.shields.io/packagist/dt/skyraptor/filament-blocks-builder)](https://packagist.org/packages/skyraptor/filament-blocks-builder)\n[![License](https://img.shields.io/github/license/bumbummen99/filament-blocks-builder)](https://github.com/bumbummen99/filament-blocks-builder/blob/master/LICENSE)\n\n**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.\n\n## 📸Screenshots\nCheck 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).\n\n---\n\n## 🚀Installation\nInstall the plugin via Composer:\n```sh\ncomposer require skyraptor/filament-blocks-builder\n```\n\n---\n\n## 📘Useage\n### Adding the BlocksInput\nThe [`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):\n```php\nuse SkyRaptor\\FilamentBlocksBuilder\\Blocks;\nuse SkyRaptor\\FilamentBlocksBuilder\\Forms\\Components\\BlocksInput;\n\nBlocksInput::make('content')\n    -\u003eblocks(fn () =\u003e [\n        Blocks\\Layout\\Card::block($form),\n        Blocks\\Typography\\Heading::block($form),\n        Blocks\\Typography\\Paragraph::block($form)\n    ])\n```\n\u003e **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).\n\n### Creating Blocks\nA 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:\n1. A **Filament PHP Form schema** for Block data definiton\n2. A **Blade view** for frontend rendering\n\nThe package does include basic example Blocks, however it is **recommended** that you do create and maintain \nyour own library of Blocks - this can be done in your project as well as in a package.\n\n#### Implement the Block\nCreate 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:\n```php\n\u003c?php\n\nnamespace App\\Filament\\Blocks;\n\nuse Filament\\Forms\\Components;\nuse Filament\\Forms\\Form;\n\nclass Example extends \\SkyRaptor\\FilamentBlocksBuilder\\Blocks\\Contracts\\Block\n{\n    public static function block(Form $form): Components\\Builder\\Block\n    {\n        return parent::block($form)-\u003eschema([\n            Components\\Textarea::make('description')\n                -\u003erequired(),\n        ]);\n    }\n\n    public static function view(): string\n    {\n        return 'example';\n    }\n}\n```\nNote the responsibilities of the methods shown in the implementation above:\n- `block()`: This method initializes and configures a Filament PHP Form Component that represents this Block.\n- `view`: This method does define the name of the view to be used on rendering the Block to the frontend.\n\n#### Create the view\nCreate a [Blade view](https://laravel.com/docs/11.x/views) (e.g., `resources/views/example.blade.php`) to render the block's output. The schema data will be accessible within the view:\n```php\n\u003cdiv class=\"example\"\u003e\n    \u003cp\u003e{{ $description }}\u003c/p\u003e\n\u003c/div\u003e\n```\n\n#### Register the Custom Block\nAdd your custom block to the [`BlocksInput`](https://github.com/bumbummen99/filament-blocks-builder/blob/master/src/Forms/Components/BlocksInput.php):\n```php\n-\u003eblocks(fn () =\u003e [\n    Blocks\\Layout\\Card::block($form),\n    Blocks\\Typography\\Heading::block($form),\n    Blocks\\Typography\\Paragraph::block($form),\n    // ...\n    App\\Filament\\Blocks\\Example::block($form)\n])\n```\n\n### Rendering Blocks\nThe package does include a [`BlocksRenderer`](https://github.com/bumbummen99/filament-blocks-builder/blob/master/src/BlocksRenderer.php) for data generated by the [`BlocksInput`](https://github.com/bumbummen99/filament-blocks-builder/blob/master/src/Forms/Components/BlocksInput.php) which can be used in two major ways.\n\n#### Blade Directive\nThe package does add a new Blade Directive named `blocks` to allow easy access to the [`BlocksRenderer`](https://github.com/bumbummen99/filament-blocks-builder/blob/master/src/BlocksRenderer.php) from within any Blade View. Use it like in the following example where the model's `content` column does contain the [`BlocksInput`](https://github.com/bumbummen99/filament-blocks-builder/blob/master/src/Forms/Components/BlocksInput.php) data:\n```php\n\u003cdiv\u003e\n    @blocks($model-\u003econtent)\n\u003c/div\u003e\n```\n\n#### Programmatically  \nIn case you do have to render your Blocks programmatically, the static `render` method of the [Renderer](https://github.com/bumbummen99/filament-blocks-builder/blob/master/src/BlocksRenderer.php) is intended to be used.\n\n---\n\n## 🤝Contributing\nContributions are welcome! Submit a pull request on GitHub. Before submitting, ensure all tests pass.\n\n### DevContainer\nThe project includes a DevContainer configuration for streamlined development. Open the `.code-workspace` file, and use the **Reopen in Container** option from the Remote Development menu in Visual Studio Code in order to use the DevContainer.\n\n### Debugging\n#### PHPUnit\nDebug test cases directly using the *Debug Tests* configuration in Visual Studio Code. It runs PHPUnit with xDebug support.\n\n#### Workbench\nThe Orchestral Workbench used for functional and browser based tests can also be previewed as well as debugged.\n\nThe [Orchestral Testbench](https://github.com/orchestral/testbench) is used for functional and browser-based tests, but can also be previewd and debugged. Follow these steps to set up the environment:\n\n1. Use the following Orchestral Workbench command to generate an empty, persistent SQlite database in the Laravel skeleton.\n   ```bash\n   vendor/bin/testbench package:create-sqlite-db\n   ```\n\n2. Next you will have to run the Migrations defined in the Workbench using the command below.\n   ```bash\n   vendor/bin/testbench migrate\n   ```\n\n4. Now that the Orchestral Workbench environment has a functional database, you will have to create a user using the following command.\n   ```bash\n   vendor/bin/testbench make:filament-user\n   ```\n\nUse the *Debug Workbench* configuration in Visual Studio Code to preview and debug the workbench. It launches Laravel’s built-in server with xDebug.\n\n---\n\n## 🛠Todo\nThe following features and quality of life improvements have yet to be implemented and added to the library:\n- Basic layout Blocks (flexbox, grid, ...)\n- Block update / upgrade migrations\n- Block asset / dependency management\n\n---\n\n## 🛡️License\nThis project is licensed under the [GNU GPL v3](https://github.com/bumbummen99/filament-blocks-builder/blob/master/LICENSE) License.\n\n---\n\nHappy Building! 🎉\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fbumbummen99%2Ffilament-blocks-builder","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fbumbummen99%2Ffilament-blocks-builder","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fbumbummen99%2Ffilament-blocks-builder/lists"}