PHPackages dunice/laravel-view-components - 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. [Templating & Views](/categories/templating) 4. / 5. dunice/laravel-view-components ActiveLibrary[Templating & Views](/categories/templating) dunice/laravel-view-components ============================== A better way to connect data with view rendering in Laravel 1.3.2(5y ago)054MITPHPPHP ^7.2 Since May 24Pushed 5y agoCompare [ Source](https://github.com/dunice/laravel-view-components)[ Packagist](https://packagist.org/packages/dunice/laravel-view-components)[ Docs](https://github.com/spatie/laravel-view-components)[ Fund](https://spatie.be/open-source/support-us)[ RSS](/packages/dunice-laravel-view-components/feed)WikiDiscussions master Synced today READMEChangelog (1)Dependencies (3)Versions (14)Used By (0) **THIS PACKAGE HAS BEEN ABANDONED** A better way to connect data with view rendering in Laravel =========================================================== [](#a-better-way-to-connect-data-with-view-rendering-in-laravel) [![Latest Version on Packagist](https://camo.githubusercontent.com/a7914fc9ae46374ce67fb7192fccc28c6ae4123bc7af1329aeedeb1acf52a11b/68747470733a2f2f696d672e736869656c64732e696f2f7061636b61676973742f762f7370617469652f6c61726176656c2d766965772d636f6d706f6e656e74732e7376673f7374796c653d666c61742d737175617265)](https://packagist.org/packages/spatie/laravel-view-components)[![GitHub Workflow Status](https://camo.githubusercontent.com/3ff2079bd1212af5aff78d02c48bdbae5d0e2df549cdf9d47a2f9513a4cc0316/68747470733a2f2f696d672e736869656c64732e696f2f6769746875622f776f726b666c6f772f7374617475732f7370617469652f6c61726176656c2d766965772d636f6d706f6e656e74732f72756e2d74657374733f6c6162656c3d7465737473)](https://camo.githubusercontent.com/3ff2079bd1212af5aff78d02c48bdbae5d0e2df549cdf9d47a2f9513a4cc0316/68747470733a2f2f696d672e736869656c64732e696f2f6769746875622f776f726b666c6f772f7374617475732f7370617469652f6c61726176656c2d766965772d636f6d706f6e656e74732f72756e2d74657374733f6c6162656c3d7465737473)[![StyleCI](https://camo.githubusercontent.com/f5d566599af9b61509fff01555ad97fb5630ae96c31bb5e459a4f77431ce5a2f/68747470733a2f2f6769746875622e7374796c6563692e696f2f7265706f732f3133343535343539312f736869656c643f6272616e63683d6d6173746572)](https://github.styleci.io/repos/134554591)[![Quality Score](https://camo.githubusercontent.com/83491d70abc5fc2100df111537f8cfeee04b62ddfe2774d5441c5dc6349ee8dd/68747470733a2f2f696d672e736869656c64732e696f2f7363727574696e697a65722f672f7370617469652f6c61726176656c2d766965772d636f6d706f6e656e74732e7376673f7374796c653d666c61742d737175617265)](https://scrutinizer-ci.com/g/spatie/laravel-view-components)[![Total Downloads](https://camo.githubusercontent.com/47b4362a7c8b356d26f6aab3c926143a972fb860ab64ef3c732884e70d477652/68747470733a2f2f696d672e736869656c64732e696f2f7061636b61676973742f64742f7370617469652f6c61726176656c2d766965772d636f6d706f6e656e74732e7376673f7374796c653d666c61742d737175617265)](https://packagist.org/packages/spatie/laravel-view-components) View components are a way to help organize logic tied to view, similar to [view composers](https://laravel.com/docs/5.6/views#view-composers). ``` namespace App\Http\ViewComponents; use Illuminate\Http\Request; use Illuminate\Contracts\Support\Htmlable; class NavigationComponent implements Htmlable { /** \Illuminate\Http\Request */ private $request; /** @var string */ private $backgroundColor; public function __construct(Request $request, string $backgroundColor) { $this->request = $request; $this->backgroundColor = $backgroundColor; } public function toHtml(): string { return view('components.navigation', [ 'activeUrl' => $this->request->url(), 'backgroundColor' => $this->backgroundColor, ]); } } ``` ``` @render('navigationComponent', ['backgroundColor' => 'black']) ``` A view component can be anything that implements Laravel's `Htmlable` contract, so you don't necessarily need to use Blade views to render the component. This is useful for wrapping third party HTML packages, like [spatie/laravel-menu](https://github.com/spatie/laravel-menu). ``` namespace App\Http\ViewComponents; use Illuminate\Contracts\Support\Htmlable; use Illuminate\Contracts\Auth\Guard; use Spatie\Menu\Laravel\Menu; class MainMenuComponent implements Htmlable { /** @var \Illuminate\Contracts\Auth\Guard */ private $guard; /** @var string */ private $class; public function __construct(Guard $guard, string $class = null) { $this->guard = $guard; $this->class = $class; } public function toHtml(): string { $menu = Menu::new() ->addClass($this->class) ->url('/', 'Home') ->url('/projects', 'Projects'); if ($this->guard->check()) { $menu->url('/admin', 'Adminland'); } return $menu; } } ``` ``` @render('mainMenuComponent', ['class' => 'background-green']) ``` The benefit over view composers is that data and rendering logic are explicitly tied together in components instead of being connected afterwards. They also allow you to seamlessly combine properties and dependency injection. This package is based on *[Introducing View Components in Laravel, an alternative to View Composers](https://laravel-news.com/introducing-view-components-on-laravel-an-alternative-to-view-composers)* by [Jeff Ochoa](https://twitter.com/@Jeffer_8a). Support us ---------- [](#support-us) We invest a lot of resources into creating [best in class open source packages](https://spatie.be/open-source). You can support us by [buying one of our paid products](https://spatie.be/open-source/support-us). We highly appreciate you sending us a postcard from your hometown, mentioning which of our package(s) you are using. You'll find our address on [our contact page](https://spatie.be/about-us). We publish all received postcards on [our virtual postcard wall](https://spatie.be/open-source/postcards). Installation ------------ [](#installation) You can install the package via composer: ``` composer require spatie/laravel-view-components ``` No additional setup necessary. Laravel will automatically discover and register the service provider. Optionally you can publish the config file with: ``` php artisan vendor:publish --provider="Spatie\ViewComponents\ViewComponentsServiceProvider" --tag="config" ``` This is the default content of the file that will be published at `config/view-components`: ``` return [ /* * The root namespace where components reside. Components can be referenced * with camelCase & dot notation. * * Example: 'root_namespace' => App\Http\ViewComponents::class * * `@render('myComponent') * => `App\Http\ViewComponents\MyComponent` */ 'root_namespace' => 'App\Http\ViewComponents', /* * Register alternative namespaces here, similar to custom view paths. * * Example: 'navigation' => App\Services\Navigation::class, * * `@render('navigation::mainMenu')` * => `App\Services\Navigation\MainMenu` */ 'namespaces' => [ // 'navigation' => App\Services\Navigation::class, ], ]; ``` Usage ----- [](#usage) ### The `@render` directive [](#the-render-directive) The `@render` Blade directive accepts two arguments: the first is the view component's path or class name, the second is an extra set of properties (optional). You can choose between referencing the component via a path or a class name. ``` @render('myComponent') @render(App\Http\ViewComponents\MyComponent::class) ``` Parameters will be injected in the view components `__construct` method. The component is instantiated with Laravel's container, so parameters that aren't provided by render will be automatically injected. ``` use Illuminate\Http\Request; class MyComponent implements Htmlable { public function __construct(Request $request, string $color) { $this->request = $request; $this->color = $color; } // ... } ``` ``` @render('myComponent', ['color' => 'red']) ``` In the above example, `$color` is explicitly set, and a `$request` object will be injected by Laravel. ### Configuration [](#configuration) #### The root namespace [](#the-root-namespace) By configuring `root_namespace`, you can define where the bulk of your view components are located. By default, this is in `App\Http\ViewComponents`. ``` app/ Http/ ViewComponents/ MyComponent.php Nested/ NestedComponent.php ``` The above components can be rendered with `@render('myComponent')` and `@render('nested.nestedComponent')`. #### Additional namespaces [](#additional-namespaces) You can register additional namespaces in the `namespaces` configuration, similar to view paths. ``` return [ 'namespaces' => [ 'navigation' => App\Services\Navigation::class, ], ]; ``` ``` app/ Services/ Navigation/ Menu.php ``` The above `Menu` component can now be rendered with `@render('navigation::menu')`. ### Testing [](#testing) ``` composer test ``` ### Changelog [](#changelog) Please see [CHANGELOG](CHANGELOG.md) for more information on what has changed recently. Contributing ------------ [](#contributing) Please see [CONTRIBUTING](CONTRIBUTING.md) for details. ### Security [](#security) If you discover any security related issues, please email instead of using the issue tracker. Credits ------- [](#credits) - [Sebastian De Deyne](https://github.com/sebastiandedeyne) - [All Contributors](../../contributors) License ------- [](#license) The MIT License (MIT). Please see [License File](LICENSE.md) for more information. ### Health Score 29 — LowBetter than 60% of packages Maintenance20 Infrequent updates — may be unmaintained Popularity8 Limited adoption so far Community14 Small or concentrated contributor base Maturity65 Established project with proven stability Bus Factor2 2 contributors hold 50%+ of commits 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 ~76 days Recently: every ~160 days Total 13 Last Release 1986d ago Major Versions 0.2.0 → 1.0.02018-05-31 PHP version history (2 changes)0.0.1PHP ^7.1 1.3.0PHP ^7.2 ### Community Maintainers ![](https://www.gravatar.com/avatar/85304ea57f50a445af10fdf5f131f059714ebc9d1c886d111533a00071d75f67?d=identicon)[dunice](/maintainers/dunice) --- Top Contributors [![freekmurze](https://avatars.githubusercontent.com/u/483853?v=4)](https://github.com/freekmurze "freekmurze (24 commits)")[![sebastiandedeyne](https://avatars.githubusercontent.com/u/1561079?v=4)](https://github.com/sebastiandedeyne "sebastiandedeyne (16 commits)")[![dunice](https://avatars.githubusercontent.com/u/1914090?v=4)](https://github.com/dunice "dunice (3 commits)")[![jmlallier](https://avatars.githubusercontent.com/u/15809946?v=4)](https://github.com/jmlallier "jmlallier (1 commits)")[![julesjanssen](https://avatars.githubusercontent.com/u/492036?v=4)](https://github.com/julesjanssen "julesjanssen (1 commits)")[![RobGordijn](https://avatars.githubusercontent.com/u/5216239?v=4)](https://github.com/RobGordijn "RobGordijn (1 commits)")[![thewebartisan7](https://avatars.githubusercontent.com/u/57477934?v=4)](https://github.com/thewebartisan7 "thewebartisan7 (1 commits)")[![adamlehmann](https://avatars.githubusercontent.com/u/15865074?v=4)](https://github.com/adamlehmann "adamlehmann (1 commits)")[![tvbeek](https://avatars.githubusercontent.com/u/2026498?v=4)](https://github.com/tvbeek "tvbeek (1 commits)")[![akoepcke](https://avatars.githubusercontent.com/u/5311185?v=4)](https://github.com/akoepcke "akoepcke (1 commits)")[![clarkewing](https://avatars.githubusercontent.com/u/7689302?v=4)](https://github.com/clarkewing "clarkewing (1 commits)") --- Tags spatielaravel-view-components ### Code Quality TestsPHPUnit ### Embed Badge ![Health badge](/badges/dunice-laravel-view-components/health.svg) ``` [![Health](https://phpackages.com/badges/dunice-laravel-view-components/health.svg)](https://phpackages.com/packages/dunice-laravel-view-components) ``` ### Alternatives [craftcms/cms Craft CMS 3.6k3.6M2.6k](/packages/craftcms-cms)[spatie/laravel-view-models View models in Laravel 1.1k3.5M14](/packages/spatie-laravel-view-models)[spatie/laravel-blade-javascript A Blade directive to export variables to JavaScript 638855.8k9](/packages/spatie-laravel-blade-javascript)[robsontenorio/mary Gorgeous UI components for Livewire powered by daisyUI and Tailwind 1.5k454.7k15](/packages/robsontenorio-mary)[livewire/blaze A tool for optimizing Blade component performance by folding them into parent templates 688221.3k17](/packages/livewire-blaze)[spatie/commonmark-shiki-highlighter Highlight code blocks with league/commonmark and Shiki 893.5M9](/packages/spatie-commonmark-shiki-highlighter) PHPackages © 2026 [Directory](/)[Categories](/categories)[Trending](/trending)[Changelog](/changelog)[Analyze](/analyze)