PHPackages erickcomp/laravel-stacked-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. erickcomp/laravel-stacked-components ActiveLibrary[Templating & Views](/categories/templating) erickcomp/laravel-stacked-components ==================================== Provides components that will be inserted into a given stack 0.9.1(2mo ago)0207MITPHPPHP ^8.2 Since Nov 25Pushed 2mo ago1 watchersCompare [ Source](https://github.com/erickcomp/laravel-stacked-components)[ Packagist](https://packagist.org/packages/erickcomp/laravel-stacked-components)[ Docs](https://github.com/erickcomp/laravel-stacked-components)[ RSS](/packages/erickcomp-laravel-stacked-components/feed)WikiDiscussions master Synced today READMEChangelogDependencies (2)Versions (11)Used By (0) [![Latest Stable Version](https://camo.githubusercontent.com/249443e6508537c30d58f9ce6b002df128e4682e51828babf3a902a98b437b42/68747470733a2f2f696d672e736869656c64732e696f2f7061636b61676973742f762f657269636b636f6d702f6c61726176656c2d737461636b65642d636f6d706f6e656e7473)](https://packagist.org/packages/erickcomp/laravel-stacked-components) [![Total Downloads](https://camo.githubusercontent.com/4eaf6a53c1d1a103a168add9a52f76021ef87e8d0105715bb83c83084677f4e0/68747470733a2f2f696d672e736869656c64732e696f2f7061636b61676973742f64742f657269636b636f6d702f6c61726176656c2d737461636b65642d636f6d706f6e656e7473)](https://packagist.org/packages/erickcomp/laravel-stacked-components) [![License](https://camo.githubusercontent.com/ba58c538d2ec568fd3040ff7437707670ce58a590a0cfebe4a83562466a357c7/68747470733a2f2f696d672e736869656c64732e696f2f7061636b61676973742f6c2f657269636b636f6d702f6c61726176656c2d737461636b65642d636f6d706f6e656e7473)](https://packagist.org/packages/erickcomp/laravel-stacked-components) Use Blade Components syntax to insert (push/prepend) content to stacks ====================================================================== [](#use-blade-components-syntax-to-insert-pushprepend-content-to-stacks) This package provides some blade components that you can use to insert content into stacks, most notably, scripts and styles. The vanilla-Blade way --------------------- [](#the-vanilla-blade-way) To push some JS file/code to a stack, you have to ([from Laravel docs](https://laravel.com/docs/11.x/blade#stacks)): ``` @push('scripts') @endpush ``` or, for inline JS: ``` @push('scripts') document.addEventListener("DOMContentLoaded", (event) => { alert("Alert 2!!!"); }); @endpush ``` It, of course, works. But when using Blade Components, the intention is stay closer to HTML whenever possible The Stacked Components Ways --------------------------- [](#the-stacked-components-ways) \####JS component: ``` ``` or, for inline JS: ``` document.addEventListener("DOMContentLoaded", (event) => { alert("Alert 2!!!"); }); ``` This package automatically calls Laravel's `asset` function by default. You can override this behavior to call you own callable or to call nothing at all. To do either of these, you can set the environment variable ``` STACKED_ASSETS_COMPONENTS_DEFAULT_ASSET_FUNCTION ``` or the config value ``` stacked-components.asset-function ``` To call any callable, you can use one of the following options the [PHP's callable syntax](https://www.php.net/manual/en/language.types.callable.php) or the Laravel's "@" syntax (`MyNamespace\MyClass@myAssetFunction`). To call no function by default you must set the config value or the environment variable with the value **false**. Note that if decide to use objects (anonoymous functions, invokable objects, first-class callables), you won't be able to use Laravel's config cache, since it does not support cache for these types of config values. #### Content component: [](#content-component) ``` ``` or, for inline JS: ``` document.addEventListener("DOMContentLoaded", (event) => { alert("Alert 2!!!"); }); ``` #### Other components [](#other-components) This package provides 4 components - js - css - stacked-div - stacked-content For the CSS and JS components, you can set a default stack in config/env and omit it when using the component, like this: .env file: ``` STACKED_ASSETS_COMPONENTS_DEFAULT_STACK_JS="scripts" STACKED_ASSETS_COMPONENTS_DEFAULT_STACK_CSS="styles" ``` and in your view file: ``` ``` ### Resolving name collisions with other components [](#resolving-name-collisions-with-other-components) This package provides the js and the css components. If your app already defined this, or even a library you're using did this, you have 2 options: 1 - Register a namespace for the components of this package. To do so, you can set the environment variable ``` STACKED_ASSETS_COMPONENTS_COMPONENT_NAMESPACE ``` or the config value ``` stacked-components.component-namespace ``` If you set the namespace with the bool value "true", it will use the namespace "stacked". If you set it to any string, the set string will be used as the blade components namespace. For more information on components namespaces check the [Laravel docs](https://laravel.com/docs/packages#autoloading-package-components) 2 - Set the config values ``` stacked-components.component-name-js stacked-components.component-name-css ``` or the environment variables ``` STACKED_ASSETS_COMPONENTS_COMPONENT_NAME_JS STACKED_ASSETS_COMPONENTS_COMPONENT_NAME_CSS ``` To specify alternate names for the js and css components Remember to clear the views caches when changing any of these values. To clear the view cache run the view:cache artisan command: ``` php artisan view:clear ``` License ------- [](#license) The MIT License (MIT). Please see [License File](LICENSE) for more information. ### Health Score 40 — FairBetter than 86% of packages Maintenance84 Actively maintained with recent releases Popularity12 Limited adoption so far Community7 Small or concentrated contributor base Maturity48 Maturing project, gaining track record Bus Factor1 Top contributor holds 100% 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 ~56 days Recently: every ~125 days Total 10 Last Release 80d ago PHP version history (2 changes)v0.1PHP ^8.1 v0.2PHP ^8.2 ### Community Maintainers ![](https://www.gravatar.com/avatar/595191205f313fecae9e4099f07cbac347fc3a27b8a9f553ac2be50e97c35730?d=identicon)[erickcomp](/maintainers/erickcomp) --- Top Contributors [![erickcomp](https://avatars.githubusercontent.com/u/12174550?v=4)](https://github.com/erickcomp "erickcomp (3 commits)") --- Tags laravelbladestackcomponenterickcomp ### Embed Badge ![Health badge](/badges/erickcomp-laravel-stacked-components/health.svg) ``` [![Health](https://phpackages.com/badges/erickcomp-laravel-stacked-components/health.svg)](https://phpackages.com/packages/erickcomp-laravel-stacked-components) ``` ### Alternatives [djl997/blade-shortcuts Blade Shortcuts is a library of handy Laravel Blade Directives. 411.0k3](/packages/djl997-blade-shortcuts) PHPackages © 2026 [Directory](/)[Categories](/categories)[Trending](/trending)[Changelog](/changelog)[Analyze](/analyze)